Docs

[bdestrempes]

Hey guys,

I have a simple website on http://staging.bdestrempes.com with a hero image with a negative (-90px) margin that is used for the transparent menu. However, when I open up the mobile menu, the hero image is pushed down but keeps that negative margin, giving a very weird look since the menu only partly pushes the content down. Is there a way to remove that negative margin or to push that content down by another 90px only when the mobile menu is open?

Thanks for your time!

[Christopher]

Hi there,

Please add following code in cornerstone settings tab/custom CSS :

@media (max-width:767px){
div#x-section-1 {
    margin-top: 90px !Important;
}
}

Hope it helps.

[bdestrempes]

Hi Christopher,

Unfortunately that didn’t work too well because then #x-section-1 would always appear at that spot instead of being directly under the transparent menu bar. I managed to fix it with this code instead:

jQuery(function($) {

$(document).ready(function() {
	$(".x-btn-navbar").click(function() {
		$("div#x-section-1").toggleClass("margin-fix");
	});
    });
});

With .margin-fix being a simple

margin-top: 0px !important

Thanks for your help!

[Rupok]

Glad that you figured it out. Feel free to let us know if you face any other issue. We’ll be happy to assist you.

Thanks for using X.

Cheers!

[Author]

Posts