Balabeque
Balabeque

Reputation: 317

A drop down menu box gets behind a Bootstrap navbar and input group

I have some positioning issues on the project I'm currently working. I'm trying to make an on-hover drop down sub-menu box, but it just falls behind the main navbar and search form (moreover, if I just put a wide div anywhere in my HTML (just for the sake of experiment), it's still shown behind the mentioned elements). It's really weird, as I just use the standard Bootstrap 3 libraries and haven't explicitly changed/overridden anything. Has anybody come across this issue and what solutions are available? Unfortunately, I'm not able to post any image here due to my profile's low reputation, so below you can find a dropbox link with an actual screenshot. Thanks a lot in advance!

https://dl.dropboxusercontent.com/u/28664459/Screen%20Shot%202014-08-15%20at%2010.57.55%20AM.png

Upvotes: 0

Views: 656

Answers (1)

Connor
Connor

Reputation: 36

It sounds like an issue with the Z-indexing, this is how the elements stack on top of each other, like a pile of paper.

If you've added an index value and it's not working, check that the element has a position value set like relative, and check to see that the offending element doesn't have a stupidly high z-index like 9999.

For more info you can read through these links:

Upvotes: 2

Related Questions