Popup Nav Tool Hiding behind Background tool

Hello, I’ve run into this before but I don’t remember what I did to fix it. When I click on my Popup Nav tool to expand it, the drop down opens behind the image in my background tool. I’ve tried setting a z index using Blacksmith but it doesn’t seem to have any effect.

Did you check the important override option? I had a similar issue, once I enabled that override it worked.

I tried that but had no effect, thanks for the suggestion.

@arlenj Can you share an example project with us so we have something to test against?

I will do that tonight when I get home, I would have done it last night but there was a very important college football game on tv…lol

1 Like

@elixirgraphics, Here’s a link to a sandbox project I setup the issue in so you can take a look.

So basically what happens here is you get a weird Z-Index situation.

Let’s say you Background tool and Image have a z-index of 10 as an example. You then put the Pop-Up nav inside the Background tool. Your Pop-Up Nav has a z-index of 2000 so you expect it will overlay the image below the Background. But it will not. While the Background and Image have the same z-index values they still have an order on the page, so the later one will be “higher” than the former one. And that 2000 z-index of the Pop-Up Nav? That is contained within the Background. So essentially in relation to the image, the Pop-Up Nav also has a z-index of 10. And thus appears behind your Image.

Set a z-index on your Background to say, 100 for example (if you’re using Blacksmith be sure to add an important override here. I think you’ll get the result you want.


Thank you @elixirgraphics for the detailed explanation. Your suggestion worked :sunglasses:, in retrospect I should have used the Container Tool, applied the CSS Grid, Justified Content to “Space Between” and used a utility class to color the container.

I decided to go ahead and reconfigure the section with a container. Much cleaner setup and works great.

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.