after fighting with IE6 on a number of projects, I’ve come up with a short list of tweaks that can make a layout behave in IE6…
Problem #1: floats seem to have duplicated text below the float.
Solution 2: use/play with the display property
Problem #2: IE6 doubles up the margin on the first element in a set of floated elements
Solution: Add display: inline to the first float
http://www.positioniseverything.net/explorer/floatIndent.html (go to the end)
Problem #3: Layout wraps columns, even when everything is supposed to fit
Solution: specify width and set overflow: none on all columns; this keeps potentially offending elements inside the floats from “breaking out” and thus breaking the layout
Lastly, I will reiterate a point I have made before: when/where possible, stay away from padding (especially left/right).
http://www.maratz.com/blog/archives/2005/06/16/essentials-of-css-hacking-for-internet-explorer/
http://www.maratz.com/blog/archives/2005/06/16/essentials-of-css-hacking-for-internet-explorer/
