Absolute positioning an element inside a fixed positioned div IE not working

OK, this is driving me crazy now, I already messed with all my code and still can’t get this to work.

I am developing a WP theme and for it I am offering users the possibility to choose between a fixed header or a fluid one.

Read More

The problem comes when the user selects the fixed one under IE where the dropdown menu is not showing at all.

I created an example site here: http://makanudos.com/tests/ for anyone who may be willing to help me.

Thanks a lot in advance!

Related posts

Leave a Reply

1 comment

  1. Wow, took me a while to find this one… and it’s a bug in IE8.

    #menuConquistador { filter: alpha(opacity=96); }
    

    is breaking the display in IE8. Disabling it makes the menu appear as expected.

    I thought it would be as simple as setting it differently as this article suggests, however, even using the correct IE8 -ms-filter extension causes the sub-menu to hide under the rest of the page.

    Edit: You might find some workarounds here if you really need a 96% opaque menu 🙂 Personally, I’d just remove the filter for IE7/8. Users with decent browsers can get the nice transparent effect.

    Also, just found Internet Explorer CSS property “filter” ignores overflow:visible

    Edit 2: OK, so adding

    #menuConquistador { -ms-filter: 'progid:DXImageTransform.Microsoft.Alpha(opacity=50)'; }
    

    and removing the z-index:10000 (there seems to be two for the #menuConquistador selector) allows the menu appear in IE8 and have opacity!