Skip to content
View in the app

A better way to browse. Learn more.

Web Designer Forum

A full-screen app on your home screen with push notifications, badges and more.

To install this app on iOS and iPadOS
  1. Tap the Share icon in Safari
  2. Scroll the menu and tap Add to Home Screen.
  3. Tap Add in the top-right corner.
To install this app on Android
  1. Tap the 3-dot menu (⋮) in the top-right corner of the browser.
  2. Tap Add to Home screen or Install app.
  3. Confirm by tapping Install.

CSS driven menu ie6 vs firefox

Featured Replies

Hello there

This really simple CSS drop down menu I have on the home button of this site www.metatradersoftware.com is driving me mad. I do not know why, but it does not want to work on ie6 altough it is working in Safari, Opera and Firefox. Would you please take a look at it and give me any idea to tackle the problem?

Thanks in advance

Viewing it on IE 7 here and your dropdown seems to pop up behind the content. Did you use z-index anywhere your code?

 

Could you post your code, hard to find the problem without the css.

I've tried to access your code by following the url but your page keeps timing out for me.

 

IE6 is very different to other browsers, if you check where you got the popup menu stylesheet from it will most likely say it's incompatible with IE, as it doesn't work in IE7 either.

 

Once we see the code we are more likely to be able to provide a work around.

  • Author
I've tried to access your code by following the url but your page keeps timing out for me.

 

IE6 is very different to other browsers, if you check where you got the popup menu stylesheet from it will most likely say it's incompatible with IE, as it doesn't work in IE7 either.

 

Once we see the code we are more likely to be able to provide a work around.

 

Ok guys,

I already kind of fixed it putting the header with a z-index above the other stuff. However, the positioning of this menu activated in the home button is still a bit different in ie an the rest of browsers. any idea?

Another thing: take a look at this. It is useful for developing: https://addons.mozilla.org/en-US/firefox/addon/60. Anyways, if you do not have firefox, I can put some code here.

Thanks in advance

This particular menu won't work in IE6 as it uses li:hover which IE6 doesn't understand.

IE6 only applies the hover pseudo-class to <a> elements.

  • Author
This particular menu won't work in IE6 as it uses li:hover which IE6 doesn't understand.

IE6 only applies the hover pseudo-class to <a> elements.

Hello EleMan

As I said in my previous post, the dropdown menu already does work in ie6. Nevertheless, its position is strange in ie6 compared to firefox,....

I know that there has to be something to fix it because there is a guy here which does a pretty similar thing and his menu gets the same position in ie6 the same as in the other browsers (he uses li:hover as well). For the time being I am still stuck with this thing.

Any ideas?

Thanks in advance

Just to clarify: IE6 does not support li:hover.

I hadn't looked at your source code before but I see that your using conditional comments so that IE6 treats the drop down menu as tables. This is why it's working in IE6.

 

However it is looking a bit off in IE6.

If I get time later, I'll take a closer look at your code (unless somebody else does first!)

  • Author
Just to clarify: IE6 does not support li:hover.

I hadn't looked at your source code before but I see that your using conditional comments so that IE6 treats the drop down menu as tables. This is why it's working in IE6.

 

However it is looking a bit off in IE6.

If I get time later, I'll take a closer look at your code (unless somebody else does first!)

Hello Eleman, I already solved the issue of the position of the drop down menu in ie6 by using a tailored hack for ie6.

 

Nevertheless, as far as I have read, it seems that the two most standard approaches to build drop down menus are Suckerfish Dropdowns and whatever:hover methods. Moreover, it seems that hacks are considered not good although they are used just for letting ie6 display pages with javascript disabled. So, eventually I guess I think that although I already fixed the problem, I might change the solution to use any of those two methods I mentioned.

 

Thanks in advance.

Create an account or sign in to comment

Account

Navigation

Search

Search

Configure browser push notifications

Chrome (Android)
  1. Tap the lock icon next to the address bar.
  2. Tap Permissions → Notifications.
  3. Adjust your preference.
Chrome (Desktop)
  1. Click the padlock icon in the address bar.
  2. Select Site settings.
  3. Find Notifications and adjust your preference.