Menu hovering over image?

juliacole · September 2017

Instead of the menu bar being all the way at the top, I'd like it to be floating over the background image like in this demo:

http://themes.muffingroup.com/be/mechanic2/

Is there some CSS I can put in my site to do that? I am currently using the split header semitransparent header layout option. Here is my website:

http://jmbinteriors.jetwebstudio.com/

Thank you!

juliacole · September 2017

Also, how do I take away the transparency? I'd like it to be the full dark red.

Bryan · September 2017

Hi,

Use this css

#Header {
	top: 50px !important;
}

To change the background, you can use this css

.header-semi #Top_bar:not(.is-sticky) {
	background-color: rgba(148, 34, 36, 1) !important;
}

juliacole · September 2017

Perfect, thank you! And how would I remove the transparency of the footer also?

juliacole · September 2017

Also, on the mobile view, the top logo is hidden behind the large kitchen image and the red menu bar. Is there a way to bring that forward? Thank you!

http://jmbinteriors.jetwebstudio.com/

Bryan · September 2017

There is no transparency on the footer.

You can use this css

@media (max-width:767px) {
	#Wrapper #Header {
    top: 0px !important;
}
#Top_bar #logo img.logo-mobile {
	position: relative !important;
	z-index: 999 !important;
}
}

juliacole · September 2017

Is there a way to move the bottom logo so it sits on top of the red footer bar just like it does on the very top with the logo on top of the menu bar?

http://jmbinteriors.jetwebstudio.com/

Bryan · October 2017

No sorry, we cannot do it with css.

Menu hovering over image?

Comments

This website uses cookies