Search code examples
jqueryuser-interfaceheadertabsfloating

ui header is blocking a div


i have built jQuery drop-down menu which is having problems floating over the UI header. Flash and everything else is fine, menu has no problem floating over anything except UI headers, i have tried messing with z-index in css files but it seems that jQuery script is over writing all of my css. the JS files are minified so i can not edit them. I think a JS solution is necessary but i do not know how to solve this with JS.

URL: http://patel.mine.nu/live%20site/metanoia/


Solution

  • You can fix it with z-index, just make sure that you position the elements to which you add a z-index, otherwise it won't work.

    Add to your top menu: position:relative; z-index:1;
    And to the bar in the middle: position:relative; z-index:0;

    If I change this live in Safari's Web Inspector it seems to work.