Internet Explorer Trashes Menus

  • smillerd


    I used Graphene Theme for a site, all works great, really like the theme. However, when I pull the site up with IE 8 or 9 (maybe all of IE, have’nt looked at older versions.) it trashes the menus and dropdowns. Color is changed dramatically – makes a mess of it.

    How can this be fixed?

    I’m more of an artist, not a programmer (I do know how to copy and paste:-).

    Any help or direction would be most helpful.




    Except IE10, Internet Explorer does not fully support gradients, or CSS3 in general. So, if you want a perfect menu in IE, you may need to use images as menu background. I would rather live with modern technology and ignore legacy browser compatibility.

    Moved to Support. Please post in the correct section next time.



    Prasanna, thanks for the reply. The problem is the site is an art club, many members have old browsers. Is there no middle ground? I’m after a perfect menu, but what I’ve seen with IE is not even close.

    Any way to get closer or at least usable?





    I visited another Graphene Themed site, using Internet Explorer and it displays the gradients fine. Why does it display correctly ( and this one does not? (

    Thanks again for any insight.




    The above site you mentioned does not use gradients. It uses the sprite image which comes with the theme for the menu background.


    Kenneth John Odle

    many members have old browsers

    There are many free browsers out there which are better than Internet Explorer: Firefox, Chrome, Opera. Even Maxthon shows the gradients in your menu correctly.

    Keep in mind that the longer you hold on to an old browser, the more vulnerable you are to security threats. That is reason enough to upgrade right there.



    Thanks Prasanna. So how do I use a graphic image? Where in WP can I tell the theme to use this option?

    This is not my site, I’m just trying to please the owners.

    Thanks again.




    So, what has to change to use sprites instead of Gradients? I’ve seen the images you mention, but don’t know how to get IE to use the Sprites instead of trying to use the gradients in the CSS.

    Any little bit of direction would sure help.






    Is it possible for anyone to point me in the correct direction as how to use images instead of Gradients? I have googled it and keep coming up with the same few post that don’t explain the very basics of how to get a browser to use images instead of gradients.

    I have looked around in the wp folders, I see the sprites that are there now (but apparently not being used?). I know how too change the colors, etc. in Photoshop. The disconnect with me is how do I get my graphene theme to use sprites.

    I agree with all of the statements that IE is trash…but, many of the users to this site are older and simply will not get away from IE. It’s simply a “bridge too far” for them.

    Any direction would be most appreciated.





    I am looking at “style.css” and under this section “/* Top leverl header menu, hover and current state */” it starts with this:

    #header-menu > li:hover,

    #header-menu > li:current-menu-item,

    #header-menu > li:current-menu-ancestor {

    background: url (images/sprite_h.png) left -300px repeat-x #eee;


    Why is the sprite not being used on the menu?


Viewing 10 posts - 1 through 10 (of 19 total)

  • 1
  • 2
  • You must be logged in to reply to this topic.