Putting slider behind menu and overlapping menu styles

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: [Links visible only for registered users] 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!

Comments

  • 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.
  • 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. 
  • Sorry but this slier does not tell us anything. What exactly you want to do and why above css is not enough?
  • 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.
  • 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; }
  • 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,
    Sarahimage
  • Actually, I just found the files and deleted them and everything is working now. Thank you again very much for all your help.
  • It's great to hear that you found it!
Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.