Putting slider behind menu and overlapping menu styles

sarahsnaturals · February 2016

I am working on the Be Theme and having a problem with setting an transparent image as a background. This is one of the pages: http://www.brickyardsquare.sarahs-naturals.com/store-directory/ In the menu section there seems to be a double overlap that I cannot find in Firebug. I'm also trying to pull the menu over the slider but part of the menu still disappears behind it. I have tried zindex but can't seem to find which div to attach the zindex to. Is this something you can help me with?

Thank you in advance!

Albert · February 2016

Hi,

the background color that you said is double, comes from top bar left section. If you don't need it, use extra css:

.top_bar_left { background: none !important; }

But in reference to 2nd question, would be great if you can show us on screenshot what exactly you mean because we do not see anything like this.

sarahsnaturals · February 2016

Thank you for your help. The code that you provided me with definitely solved the problem of the over lap, thank you. I put it back at the moment because when I took it out, that was the only part of the menu that showed up with any background over the slider. Here is a screenshot. I drew an arrow to show where I can see the rest of the header and it's only a small amount because the slider is not flush all the way to the left. I hope this helps. Thank you again in advance.

http://www.brickyardsquare.sarahs-naturals.com/wp-content/uploads/2016/02/Screen-Shot-2016-02-25-at-4.20.20-PM.png

Albert · February 2016

Sorry but this slier does not tell us anything. What exactly you want to do and why above css is not enough?

sarahsnaturals · February 2016

If I use the above CSS, the menu background does not show up at all. What I would like is for the the entire header (without the .top_bar_left background and what is on the left and right that extends all the way to the edges) to show up over the slider. Right now, only the .top_bar_left shows up over the slider.

Albert · February 2016

With what you already did, it won't be possible because you can not increase top bar right section's width. What you should do is use above css to remove it's background and use the following css to set it again but for the whole Top Bar instead:

#Top_bar { background: rgba(255,255,255,0.5) !important; }

sarahsnaturals · February 2016

I've decided that I'm going to have the slider start under the menu, I'm finding that there is a black and green bar behind the menu that I cannot find in Firebug. I'm attaching a screenshot. It's not part of the background I set. Is there a way to get rid of this?

Thank you,

Sarah

sarahsnaturals · February 2016

This is the URL if it helps: http://www.brickyardsquare.sarahs-naturals.com/

sarahsnaturals · February 2016

Actually, I just found the files and deleted them and everything is working now. Thank you again very much for all your help.

Albert · February 2016

It's great to hear that you found it!

Putting slider behind menu and overlapping menu styles

Comments