[thelist] CSS again: suspected IE funkiness on inline UL

Rob O'Rourke rob at sanchothefat.com
Thu Dec 14 17:17:52 CST 2006


Joel D Canfield wrote:
>> No bottom border instead of a white one, relative position, shifted
>> down a pixel to overlap the bottom border of the UL element, so in
>> your .currentpage rules:
>>
>>   border-bottom: 0;
>>   position:relative;
>>   top:1px;
>>     
>
> then, go look at it in FireFox, which gets the existing rules right :)
>
> yeah, tried that, hoping somehow FireFox would read my mind. It didn't.
> If I can only have it right in one browser, I'm stubborn enough to make
> it FireFox (at least this afternoon I am) and I'd really really prefer
> not to resort to IE hacks, but I also realize that, in the real world,
> sometimes that's what you do. I just don't know what that would be, and
> I don't even wanna know unless there's not a 'unhacky' fix.
>
> joel
>   

Hi Joel,

Unless you want that navlist centred I'd reccommend floating those list 
items left instead of displaying them as inline elements. That way you 
can treat the anchor tags as block level elements and things should be 
more consistent in IE.

Take a look at some of the examples on listamatic for guidance:
http://css.maxdesign.com.au/listamatic/

You will probably need to float the <ul> to contain the <li>s and then 
use a clear: both; rule on your main content area.

Also watch out for IEs doubled float margin bug, use display: inline; on 
the <li>s themselves then display: block; on the links within.

Good luck,
Rob





More information about the thelist mailing list