Menu overlapping the Slider

Support
#1

Hi there,
Can you help me make it so that the menu on this site: https://www.whisperingsprings.ca/ overlaps the slider image?

#2

Hi @dtourcreative,

Thank you for writing in, please add this to Theme Options > CSS

.home .masthead.masthead-inline {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
.x-logobar, .x-navbar, .x-navbar .sub-menu {
	background-color: transparent;
	border-bottom: 0;
}

But before you add that, please add the missing closing bracket (}) on your custom CSS, or else the CSS provided will not work.

Cheers!

#3

Almost works! https://www.whisperingsprings.ca/
How do I make the background transparent?

#4

Hi @dtourcreative,

You may replace the code with this.


.home .masthead.masthead-inline {
	position: absolute;
    top: 0;
    left: 0;
    right: 0;
}
.home .x-logobar, 
.home .x-navbar, 
.home .x-navbar .sub-menu, 
.home #mega-menu-wrap-primary {
	background-color: transparent !important;
	border-bottom: 0;
}

Hope that helps

#5

Almost there. The background colour on the menu under HOME or whatever menu item you hover on - I can’t seem to control that colour. Any sugggestions?

#6

Hi @dtourcreative,

To change the hover background, you can add the code below in Theme Options > CSS

.home #mega-menu-wrap-primary #mega-menu-primary > li.mega-menu-item > a.mega-menu-link:hover {
    background: #333;
    color: #fff;
}

Change #333 and #fff to any color you like.

Hope this helps

#7

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