- HTML-CSS
As part of the foundations portion of the Dev academy program I've been revising my HTML and CSS skills. One of the tasks is to research one topic in particular so I've chosen the one below as it is the one I had to remind myself and do a little research on:
What does it mean to display inline vs inline-block?
-
Inline:
An element that is displayed inline follows the natural order of the document. They do not start on a new line and only take up the space required for their content. These elements won't create line breaks and can only add space to the left and right of the element. You can't add alter the height or top/bottom padding or margins.
-
Inline-block
An element that is displayed as inline-block has a portion of both the inline and block display properties. An inline-block element won't start on a new line and continues in the normal flow of the block element it is contained in. It can however have it's width and height altered, along with having padding and margins added on all four sides.