Empty div height issues in IE6

Sometimes your website will need to use empty divs for display purposes - e.g.: showing an image to make the top/bottom of an element look curved.

Typically, you would use an empty div, and set it's background image in css; but for floated or cleared elements, height is ignored. IE6 assumes that the element has text inside it, causing it to be slightly taller than the curved-top bg-image.

To correct this, explicitly set font-size:0; in css for the element with the curved bg-image.

Note - you must use an end tag to avoid any problems with the left or right padding. E.g.:

<div id="container_top_curve"></div>