Chapter 9: Spacing Out with Boxes 175
Here’s the code that produces Figure 9-8:<body><p style=”width: 35%;”>
If you allow your Web page to simply be calculated by the
browser--the default simply stacks the elements
along the left side of the screen in the order
that you locate them in the HTML code. This normal
positioning takes effect unless you specifically
use positioning or floating to violate the normal
stacking behavior.
</p></body>To understand the box height of an element, you may need to consider a total
of seven properties that can be involved:height(the actual content of the element)padding-top
padding-bottomborder-top
border-bottommargin-top
margin-bottomThe box’s bottom determines where the top of the box surrounding the next
element just below can be positioned (in the default normal flow positioning).Figure 9-8:
When you
adjust a
paragraph’s
height, you
can force
elements
beneath it
down, even
out of the
window at
the bottom.