Click to See Complete Forum and Search --> : little gaps between floats - IE


KDLA
09-04-2007, 10:39 AM
link (http://apps.cpe.ky.gov/temp_docs/prototypes/kyvc/new6.htm)

How I want it to appear: Firefox
Gaps appear in: IE6

I've canceled out all padding and margins with * {margin: 0;padding: 0;}. The floated divs are each 200px; the middle one 400px.; the container, 800px. If I put width: 400px; on the middle one, it is pushed down the page, clearing the floated divs. If I get rid of the width setting, everything moves up, but then the middle div has a 4px margin applied on the sides.

:confused:

KDLA

Centauri
09-04-2007, 11:00 AM
IE6's 3-pixel jog when floated elements are beside normally-positioned elements that have a size given (the height). Fix is to float the centre column as well.
#middle {
display: block;
margin: 0;
width: 400px;
float: left;
background: url(images3/guy.jpg) no-repeat center top;
height: 290px;}