Question

Hello I am trying to understand differences in the rendering of this page in Chrome (the target) and IE 7/8:

http://phor.net/PRIV/md2/ (it validates)

In IE 7, the top navbar does not float the LIs and in IE 8, there’s a hideous margin at the top.

This page is very simple, with all style in

http://phor.net/PRIV/md2/style.css

Any idea on how to fix that navbar? Thank for your help and discussion.

Answer 1

IE7 does not fully support the inline-block property that you are using on your navigation bar.

http://www.quirksmode.org/css/display.html

Try using floats instead.

#navbar ul li { float: left; } 

Make sure you clear your floats afterward.