Hey, i am trying to fix a site I am helping a friend with, and in IE it is displaying the navigation bar like it is stacking on top of each other.
Is that a part of the double float bug, I tried adding display:inline, but I still have that problem.
Thanks,
Ryan
URL: http://www.flanels.com/RadiantecHOME.html CSS: http://www.flanels.com/style.css`
Doesn't look like double float to me.
From what I can see from IE dev, the <li> in IE have neither the display nor float applied, but it the style '#top-navigation ul li' is bound because the margin is being set to 0. I see that you're using the transition doctype so I'd start by changing that to strict if you can to get out of the difficult-to-predict quirksmode.
As smiller points out you don't need float and inline, so you should then remove one of them, then I suggest start simplifying the code to find what the conflict is.
Hopefully changing to strict will sort you out straight away.
I saved a local copy and modified #top-navigation to remove float: left;.
That seemed to make the top menu render the same in Firefox and IE, I have no idea what other problems it may have created however.
One of the problems I'm seeing in both IE and Firefox is that there are white vertical bars (breaks between the images) in addition to the slanted ones which I believe are part of the images.
The other thing is that if the browser is not wide enough, the top level menu does wrap as necessary.