7.2 Positioning Images
The img element is an inline element (more formally, a phrasing element), so it gets displayed within the normal flow of its surrounding text. That works well for small images (icons), but not so well for medium and large images. See the smiley face image in FIGURE 7.1. It’s a small image, an icon, and its default inline positioning works well. But the tree photographs? They’re taller and their default inline positioning causes the browser to generate quite a bit of dead space above the text lines in which they’re embedded. In general, you should avoid such dead space.
FIGURE 7.1 Trees web page with default picture ...
Get Web Programming with HTML5, CSS, and JavaScript now with the O’Reilly learning platform.
O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.
