Leaving here in case anyone else has a similar issue.
Here's the CSS that's giving me nightmares with IE...
#leftcol { float: left; width: 200px; margin: 0; padding: 0; } #leftcol ul { list-style-type: none; margin: 0; padding: 0; } #leftcol li { } #leftcol li a { display: block; margin: 0; padding: 9px; text-decoration: none; color: #AAF; } #leftcol li a:hover { text-decoration: underline; } #content { margin-left: 200px; width: 600px; border-left: 1px solid #FFFFFF; } #content div { width: 96%; margin: 0 auto; padding: .5em; text-align: justify; }
An approximation in FF;
leftcol div | content div
And IE;
leftcol div | content div
I did hack in a fix that floats the content div to the right and sets a negative top margin on the content div. It worked in IE, FF, Opera, Chrome and Safari. But I was just wondering if anyone else had a suggestion.
[EDIT] Did more testing with the above and it's unreliable unless I use pixel values for fonts, which I do not want to do.
[EDIT] And damn you Jeeves for passively, and unknowingly, making me start using DIVs. Jerk...
EDIT AGAIN - Fixed it. It was the IE float drop bug. I removed the static width on the container and bam. Up it went.
Edited by Beowulf, 08 April 2009 - 08:16 PM.