I am having problems with my navigation and other components when looking into different IE version.
In IE 9 and 7 the attributes of my menu completely disappear and the drop down shows behind a image slider. And I have also a problem with an image on the footer image.
Is there anyone who can help/teach how to fix these IE bugs?
Off hand I would say you have some issues in Chrome too. I can't click on any of the submenu items because they disappear to quickly when I mouse-off the top level item. You might want to think about reducing the margin there.
Dropdown behind slider bug is a z-index issue. Older IE browsers need the position:relative; z-index rule directly on the highest parent of the elements.
So if the menu is in the header tag than the heder tag gets position:relative;z-index 90
and the section tag which comes directly after the header tag which has the slider will get
the position:relative;z-index:70
The footer images problem is that the footer-top div is absolutelly positioned but you forgot to mention a left value.In ie this takes the auto value so the grass image will not start from the left. So you should set left:0 to .footer-top
The menu could have a hasLayout problem, so you should try a zoom:1 rule on it, or on one of it;s parents. For testing purposes you could just write * {zoom:1}
I am having problems with my navigation and other components when looking into different IE version. In IE 9 and 7 the attributes of my menu completely disappear and the drop down shows behind a image slider. And I have also a problem with an image on the footer image.
Is there anyone who can help/teach how to fix these IE bugs?
Many Thanks
By the way the url is http://www.migrationdownunder.com/md2/index.html
Off hand I would say you have some issues in Chrome too. I can't click on any of the submenu items because they disappear to quickly when I mouse-off the top level item. You might want to think about reducing the margin there.
I think you might need to force IE to render in Standards Mode as (I think) it's defaulting to Quirks.
Add this to your head:
Paulie
It didn't work :( Im still facing the same issues
Dropdown behind slider bug is a z-index issue. Older IE browsers need the position:relative; z-index rule directly on the highest parent of the elements.
So if the menu is in the header tag than the heder tag gets position:relative;z-index 90 and the section tag which comes directly after the header tag which has the slider will get the position:relative;z-index:70
The footer images problem is that the footer-top div is absolutelly positioned but you forgot to mention a left value.In ie this takes the auto value so the grass image will not start from the left. So you should set left:0 to .footer-top
The menu could have a hasLayout problem, so you should try a zoom:1 rule on it, or on one of it;s parents. For testing purposes you could just write * {zoom:1}
Hi Jozsef
Thanks for your reply. Do you suggest another code for the menu area? You mentioned a has layout problem, so does it mean I should try something else?
Maybe you have a link to a tutorial that I can achieve something similar.
Sorry.I was mistaken.
1st step: #header_inner { position:relative;z-index:90 }
2nd step: You take out the z-index:50px from .nivo-slice that is located in the nivo-slider.css
I've tried it this way, and it worked in IE7