Here’s a demo I made displaying a rounding error with IE and my solution to it.
Basically, any time you’ve got two or more floats next to each other and their widths, defined in percentages, equals 100%, you’re going to run into this rounding error.
I’ve seen this a lot, but never really focused on it as I found that other hacks would sometimes resolve the issue.
But the hack presented in the demo ( setting negative margins on the right-most floated block element ) works much better and is less hacky. I like it.
Hopefully you will find it useful.
Awesome! I was wondering what was going on with my eCommerce site. Everything would always work smoothly in FireFox, but every once in a while I would get my right column dropping below my content because of this bug.
Great fix!
Thanks You for your elegant hack. I am a novice in CSS, designing a new page in it (at work) and most of explanations are so obscure that I have a hard time to get it. Yours is the best. And the design of your site is something to admire
Thanks again
Larisa