Stylesheets - fluid css problem

Author

fluid css problem

Clint

2004-06-22, 7:22 pm

Hello,

I have created a fluid css design for my organization web site, but I
am having a small problem with how a table reacts to resizing in IE.

I have uploaded an example here: http://data.mnwfc.org/lmi/tools/

If you resize the browser (IE only) smaller, you will see the TABLE in
the middle jump down at a certain point. How do I stop the table from
doing this?

Thanks,
Clint

Barry Pearson

2004-06-22, 7:22 pm

Clint wrote:
> Hello,
>
> I have created a fluid css design for my organization web site, but I
> am having a small problem with how a table reacts to resizing in IE.
>
> I have uploaded an example here: http://data.mnwfc.org/lmi/tools/
>
> If you resize the browser (IE only) smaller, you will see the TABLE in
> the middle jump down at a certain point. How do I stop the table from
> doing this?

I'll make a wild guess. Feel free to laugh!

I notice that the table drops down in IE at about the same viewport width that
a horizontal scrollbar appears in other browsers. So it is presumably driven
by the floated left navigation. (I guess you already knew that).

IE 6 has a bug called "the 3 pixel jog". Material in a floatholder to the
right of a left-floated box is offset an extra 3 pixels despite a sufficient
left margin to keep the material away from the floated box. Your material
happens to be a fixed width table. So, while that table is to the right of the
left navigation, it appears to take 3 pixels more than it should. So when you
squeeze in the viewport, it drops down until there is room. Once it clears the
float, it is then 3 pixels narrower, which is as narrow as it can get, and so
from then on it won't drop further, but instead a horizontal scrollbar
appears.

http://www.positioniseverything.net...hreepxtest.html

Hey, don't laugh! I've just put screen-shots into Photoshop, and the gap
between the table & the left navigation drops from 21 pixels to 18 pixels when
the table drops. Very suggestive of a 3-pixel jog.

Cure? See if the above source helps.

--
Barry Pearson
http://www.Barry.Pearson.name/photography/
http://www.BirdsAndAnimals.info/
http://www.ChildSupportAnalysis.co.uk/