CSS div contained in parent incorrectly with IE

Question

I am having a problem with this website displaying incorrectly with IE. http://outlawstar.zymichost.com/

I think that the problem is that menu_bar is not contained within the head div. However, the code works properly in both chrome and firefox. Any suggestions? Thanks!

Answer 1

Well one of the problems is that the combination of your logo div and menu_bar div exceeds the width of your head div. If I set your menu_bar div to 740px it fits just fine. The other thing you should do is add a div after menu_bar like the following: <div style="clear:both"></div>. That way you clear your floats that you set inside the head div.

Edit:

Also, there seems to be an issue with the li set to display: inline-block in IE. To get it to work there you want to set it to just display: inline but this unfortunately messes with the li style in firefox. It might be prudent to set up a different stylesheet just for IE.