HTML and CSS Reference
top are ignored because these are two inline-level elements.
Figure 6-13. Two inline-level elements will line up side by side by default.
Now if an additional style rule is added to convert the second box into a block-level
level element */
the appearance of the second link changes to include the width and height (and margin
so the elements don't overlap), as shown in Figure 6-14 . The whole area of the larger
rectangular shape is part of the link's active area, so having an anchor element display
as a block-level element offers more flexibility in the size of the linked area. This aspect
is particularly useful when creating menus, for instance.
Figure 6-14. Inline-level and block-level boxes. The block-level box moves to its own line.
A problem with setting an inline-level element to display as a block-level element is
that the block element will move below the content that came before it, starting a new
format the element as being in a block-level box but then treat the formatted box as if