WordPress.org

1. questions4wp
   Member
   Posted 1 year ago #

   I'm attempting to take over an existing website that was made using WordPress. The original developer had put up an image for a banner directly underneath the navbar at the top. When you hover over the navbar, which contains the pages, you see a list of subpages for that particular page. Fairly standard WordPress functionality I think.

   My client then asked me to change the image at the top to be a slider thing, so I used this: Featured Content Slider thing. It worked well, I deployed it and it works fine...on its own. However, it appears in front of the navbar, such that the dropdowns get cut off and are unreadable. I've been trying to mess with the z-index in CSS, putting the entire menu bar in a wrapper with a z-index of 2 while the slider is within a wrapper with a z-index of 1. I can't seem to get it to work. Any thoughts? I'll gladly provide more information or code if need-be. Thanks!

2. questions4wp
   Member
   Posted 1 year ago #

   I've solved the problem, and I'm posting my solution here because I haven't found very much help online. Essentially the problem was that I tried making a wrapper around the menu and setting its z-index to a value higher than the content, but that didn't work. So instead, I took a look at the HTML of the page and found that menu items were part of nested lists. I changed the CSS for "ul", "ul li", etc. to have a z-index greater than the content, and now it appears as it should. I hope this helps.

3. aestheticdesign
   Member
   Posted 9 months ago #

   I had the same problem, even though all of the affected elements had a position statement along with the z-index statement.

   I fixed it by adding z-index: -1; to the #content.

Topic Closed

This topic has been closed to new replies.