Jon Hughes wrote:
> http://goonsquad.org/jon/
>
> If you view this page in IE, the text below "design blog" is being
> pushed down past the #nav
>
> How can I fix that? It seems to be it's either clearing the div, or
> it's too wide, thus pushing itself down.
You're right.
1: You are using a construction that IE simply can't handle the same way
as other browsers do. #menu is floated, and cleared, inside #content,
and no element below #menu inside #content can flow up past that #menu
in IE.
This means the <h4>January 28, 2007</h4> can't flow higher than the top
edge of #menu.
So, you should take #menu out of #content.
2: #post is full of elements that are wider than its 425px, and IE6 (and
older) will auto-expand any container until content fits inside.
#post has Layout[1] because it is given a width - even though IE6
doesn't respect that width, thus the entire #post gets stuck below #menu.
The addition of...
#post {overflow-x: hidden;}
...will save IE6 on this point.
----
It is probably easiest to fix it by floating the entire #content (sans
#menu) as a fixed-width left column and let #nav and #menu be parts of a
fixed-width floating right column. That's an ordinary 2 column
float-layout that no version of IE will have any problems with.
Width / overflow / auto-expansion control in IE6 will be just as
important though.
regards
Georg
[1]http://www.satzansatz.de/cssd/onhavinglayout.html
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
