Hello there!
I have a page which has a rendering issue in IE for Mac, and Mozilla on both Mac and PC:
http://www.chaotech.com/chaotech/conformia/html/sub.html
http://www.chaotech.com/chaotech/conformia/html/conformia.css
If you look at the page in one of those browsers/platforms, you will see that the subnavigation (lighter blue-gray) floats behind the subsequent main navigation items.
The left navigation is rendered using semantic HTML techniques: ULs are used to markup list items (which are actually images, since the text is a non-standard font). There must be something in the CSS file that is allowing the main UL to cover up the sub UL.
Can anyone help me? I have exhausted all my tricks!
Jennifer
IEmac/Mozilla(PC and mac) nested ULs : sublist floats behind
Haven't had an in-depth look at the code but, do you have any floats on the ul?
float float float
Yes, I do have a float on both UL styles, as well as the containing DIV. I had ot use float on the DIV to position correctly, and on the UL or else it would be placed 15px to the right in IE6 on WinXP.
I tried using a <br clear="all"> before and after the nested UL, but that didn't work. I also tried just <br class="brClear"> and used .brClear { } in the css file. I also read somewhere that you could use an <hr> with the style set to hidden, but that didn't work either.
Oh, and the same rendering issue occurs in Safari too - that's Mozilla-based, isn't it?