boxes
Each box has a content area and optional surrounding padding, border, and margin areas. The size of each area is specified by properties. The margin, border, and padding can be broken down into top, right, bottom, and left segments. The perimeter of each boxes is called an “edge”, so each box has four edges.
The content overflows without disturbing the flow. Note that a long string (i.e., a URL) or a large image would stick outside the box as well.
IE 6 does not ‘support’ width
nor height
so, in IE6, boxes expand to accomodate the dimensions of their content. Note that this behavior often leads to a ‘drop float’ (a float that drops below another).
Style the yellow box with line-height:0
.
Style the yellow box with line-height:0;height:auto
.