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 - CSS Tutorial
From the course: Making Sense of the CSS Box Model
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
-
-
-
-
-
(Locked)
What is the CSS Box Model?4m 50s
-
(Locked)
Changing the contents within the box2m 28s
-
(Locked)
Understanding the display porperty2m 43s
-
(Locked)
Sidebar: Images are inline elements2m 21s
-
(Locked)
Position is everything3m 4s
-
(Locked)
Floating and clearing content2m 40s
-
(Locked)
Using the clearfix2m 28s
-
(Locked)
Pseudo elements: Making the browser hallucinate2m 49s
-
(Locked)
-
-