FF and IE6 show div correctly. IE7 has gap above div.

Hello,

I am working on a website for the school where I work, and I had a pretty good layout going. With some hacks, FF and IE6 both display it properly. However, IE7 is displaying a small gap above my mainnav div. Here is a link to the page (http://www.ridge.k12.wa.us/schools/rhs/). Any help and explanation would be greatly appreciated.

I am not very good with CSS. But here is something you should check in your css. I am not sure if it the cause of the problem...but check it anyway.

>html #globalnav {he\ight: auto;} /* for IE5/Mac */

Well IE7 now understands this
html >body
I also saw you put overflow:visible on your li for your main nav. Get rid of that.

I thank you for your responses, but it didn't fix the small gap above the main nav. Is there anything that FF understands that IE7 doesn't (or vice versa)?

Add this after your globalactions div
<div class="clear">&nbsp;</div>
change the class .clear in your CSS from this
.clear{clear:both;}
to this
.clear{clear:both;line-height:0px;font-size:0;}

Thanks. It works perfectly.