z-index issue with twitter bootstrap dropdown menu

Just realized what's going on.

I had the navbar inside a header which was position: fixed;

Changed the z-index on the header and it's working now - guess I didn't look high enough up the containers to set the z-index initially !#@!?

Thanks.

IE 7 on windows8 with bootstrap 3.0.0.

.navbar {
  position: static;
}
.navbar .nav > li {
  z-index: 1001;
}

fixed

Ran into the same bug here. This worked for me.

.navbar {
    position: static;
}

By setting the position to static, it means the navbar will fall into the flow of the document as it normally would.

This will fix it

.navbar .nav > li {
z-index: 10000;
}

I had the same problem and after reading this topic, I've solved adding this to my CSS:

.navbar-fixed-top {
    z-index: 10000;
}

because in my case, I'm using the fixed top menu.

In my case in addition to z-index I had to set overflow: visible in parents elements

Still the issue with Bootstrap v3, navbar and dropdown have same z-index ;-( I just increased .dropdown-menu z-index to 1001.

Solved by removing the -webkit-transform from the navbar:

-webkit-transform: translate3d(0, 0, 0);

pillaged from https://stackoverflow.com/a/12653766/391925

Just give

position: relative; 
z-index: 999;

to the navbar

This fixed it for me:

.navbar-wrapper {
  z-index: 11;
}

Solved this issue by removing transform: translateY(50%); property.

This worked for me:

.dropdown, .dropdown-menu {
  z-index:2;
}
.navbar {
  position: static;
  z-index: 1;
}

I had the same problem, in my case because i forgot this in my NavBar style: overflow: hidden;