Issue with menu

• 

  neilscrivener · Member · Sep 3, 2022 at 7:06 pm

  • Copy link
  • Add topic to favorites

  Hi Guys,

  I’ve seen a few posts about editing the CSS to stop the Menu being behind the header.

  I’ve the same issue: neilsoneworld.com – but I’ve edited the CSS – and still getting the same issue?

  I’ve done this going to Appearance -> Customize which takes me to the attached screenshot.

  Am I doing the wrong thing in the wrong place?

  Thanks!
  N

  The blog I need help with is: (visible only to logged in users)

• 

  neilscrivener · Member · Sep 3, 2022 at 7:07 pm

  • Copy link

  Sorry, realized I can’t upload a screenshot – code is here:

  .main-navigation {
  position: absolute;
  top: 325px;
  z-index: 9999;
  }

• 

  thomasjvu · Member · Sep 3, 2022 at 7:22 pm

  • Copy link

  Hi there!

  I checked out your website and it looks to me that the menu is visible and on top of the header. I’ve attached a screenshot of what it looks like on my end.

  

  Is this what you want your header / menu to look like?

  Sometimes, you may need to clear the browser’s cache in order to see changes immediately, as the cached version is still being displayed. You can also try using a different browser to see if the changes have settled.

  For reference, here’s a support article regarding browser cache: https://wordpress.com/support/browser-issues/#clearing-your-browser-cache

  I hope this helps!

• 

  neilscrivener · Member · Sep 3, 2022 at 8:21 pm

  • Copy link

  Hi, it does – but when the menus drop down they seem to then go behind the header image – unless I’m wrong on that?

• 

  thomasjvu · Member · Sep 3, 2022 at 10:06 pm

  • Copy link

  Hello again,

  I understand what you mean. It seems that there’s some weirdness going on with the theme. I wasn’t able to target the drop-down and change the z-index successfully either. You may need to contact your theme’s provider.

  I did think of some workarounds:

  One workaround would be to adjust the height of the header to be larger than the drop-down menu:

  
  #site-header {
      height: 650px;
  }
  

  Another workaround would be to adjust the content’s margins a bit, but this makes the website’s overlap style look a bit different:

  
  .content {
    z-index: 0;
    position: relative;
    margin-top: 100px;
  }
  

  I’m sorry that I couldn’t be of better assistance.

  That being said, if you purchased the Blogily theme from Superbthemes, you may be entitled to premium support from them and they should be able to work out the kinks for you.

  Here’s a link to their support: https://superbthemes.com/customer-support/

  I hope this helps.

• 

  neilscrivener · Member · Sep 4, 2022 at 4:19 pm

  • Copy link

  Thank you for this :)

  This solution seems better!

  Thanks!
  N