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.