[thelist] falling floats [was: csshover.htc and IE security warning]

[kasimir-k]

jono at charlestonwebsolutions.com scribeva in 09/02/2006 22:07:
>> http://www.charlestonwebsolutions.com/test_case/index_test2.html

> However, number 2 has still got me confused.  The whole 10 pixel
> increments of window resizes causing the sidebar boxes to drop in IE is
> very odd?  Anyone have an idea as to why that might be? 

Yep. 70% + 30% > 100%... at least sometimes, or to be more price: every 
10px times ;-) This is because every 10px the reminder is 0.5px, thus 
both 70% and 30% get rounded up, which brings the total width to 100% + 1px.

You have:

#sidebar {
	float: right;
	width: 30%;
	}


Change 30% to 29.5% and the side boxes drop no more.

> Can you suggest a "routine" fix for something like this, such as 
> "fixing float drops on resize in IE?"

<tip type="CSS" author="kasimir k">

If you want to avoid falling floats and/or horizontal scroll bars, you 
should avoid widths totaling to 100% - e.g. with widths 70% and 30% and 
1005px available space you get
70% = 703.5px => 704px
30% = 301.5px => 302px
                  =====
                 1006px!!

Using 70% and 29.5% will save you from hefty head scratching.
</tip>

.k