Posts: 3,987
Name: Abel Mohler
Location: Asheville, North Carolina USA
|
Darren, it looks like there are a couple of empty paragraphs(with <br class="clear" /> inside them, directly under your your <div id="invertedtabs"> When I removed them in Firebug it didn't appear to do anything. Also, there are two empty paragraphs (with nothing in them) underneath #invertedtabs's containing div (#header-top). When I removed them it made the slim gap go away (in Firefox). It would be better to use a margin for this. Maybe if you do both of these it will fix IE.
***EDIT***
Hey, I found the solution. Please ignore the above. On the element #header-top, you have a height set, then you have the #invertedtabs inside of it, but just overflowing outside of the #header-top so that it is still visible. The problem is that IE6 has a bug that causes containers to expand past their set height, if their contents are larger than the container, as if height is actually "min-height". You must be very careful with IE6 with this.
When I remove the:
from #header-top, Firefox does the exact thing that is happening in IE6. Remove that height command, then remove all of the paragraphs that I mention above(they are causing the big gap when you use normal flow like this). Now you will have a slightly-too-large margin on the bottom of the tabs. It is coming from the <ul>. Adjust its margin-bottom and you're good to go!
__________________
I build web things. I work for the startup Please login or register to view this content. Registration is FREE
.
Last edited by wayfarer07; 07-11-2008 at 08:11 AM..
|