[SOLVED] Site not visible or screwed up in IE9 - eek!

[PVM3]

You started with a "no" - do you mean something's wrong with the menu boxes? What, the white outline curves but the boxes don't?

[meesa]

I mean:

[PVM3]

OK - is that it? I see the problem with the white border/boxes; and you're saying the menu is dropping. Anything else?

Thanks!

[meesa]

Not that I know of.

[PVM3]

I just read something saying IE9 doesn't render gradients - I don't know if that's the problem. Ie8 just ignores the gradient and the box-radius, which is fine. It doesn't split the difference.

[meesa]

I don't know about gradients, but the border should work fine. It could be an over flow thing, where the parent has the radius, but the child isn't being cut off at the point.

[chrishirst]

Without delving into the code, I suspect that your "menu" has a left float, and the "content" has a right float, and your left float is before the right float in the normal flow (source code order).

Reverse that, putting the right float before the left float.
All rendering engines assign space (horizontally) from left to right unless reversed by a HTML direction directive. and the Trident engine (used by IE) does get it slightly wrong when it has to render a left float before a right float where the width tolerance of the two element in the parent container is relatively small

[PVM3]

Hi Chris:

Thanks for your input. Actually, my navbar has no float, but the content to the right has a right float. I have the navbar last in the HTML order because when the site flows to a 1-column for smartphones, I wanted the nav at the bottom, below the content.

So I have to rethink this I guess.

[PVM3]

I'm hoping there might be a solution that won't require me having to rewrite everything or do a separate stylesheet for IE9.

Currently my navbar is NOT floated and it's near the end in the HTML - it's the last thing before the footer.

The content boxes are floated right, and are before the navbar in the html.

In ie9 (and ie7) the navbar is dropping. I'm not worried about IE7 in this case, but am trying to get IE9 sorted.

I was able to add a conditional comment to the stylesheet and html to remove the white border on the navs in IE9. Now I need to get that navbar up.

Any ideas would be really appreciated!

[meesa]

Basically, your HTML (in the middle) is like this right now:

[CONTENT]
[MENU]

Make it:

[MENU]
[CONTENT]

Then float the menu left, and the content right.