From the course: Making Sense of the CSS Box Model

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Sidebar: Images are inline elements

Sidebar: Images are inline elements - CSS Tutorial

From the course: Making Sense of the CSS Box Model

Start my 1-month free trial

Sidebar: Images are inline elements

“

- At this point, it's necessary to take a quick sidebar and address images. As I've mentioned several times earlier, in HTML images are considered inline elements due to their original definition as small figures or graphics to extenuate text. To see what I mean think about how emoji are added to a sentence. You have words, then the emoji appears and then you have more words. The emoji appear inline and by default the image acts in the same way. You have the words, then your emoji then an image and all of them appear inline. This has some specific consequences that need to be considered when applying the box model to images. If you add an image to a HTML document within another element, it will appear inline with the rest of the content. This however is not how we normally want to display images. In fact, I can find very few instances where default display setting for the image element makes any sense. The way…

Contents