Menu problem - messing pages up

I would prefer my menu to be a static menu.

However when i select the static menu, my pages mess up. The content of the page goes behind the menu. The front page though is fine but my other pages mess up.

I need to know why this is and how to fix as soon possible.

By the way the sticky menu does not cause any issues but the thing is i want a static menu.

Hope you can help and it would be much appreciated.

Hello @uzi012,

Can you please provide some explanatory screenshots and a link to your website in order to let me inspect it?

You can upload screenshots to your WordPress Media Library and share a link, or you can use one of the online screenshot services.

Kind Regards, Roman.

Hi @Roman,

Sure, please view the links below.

Sticky menu

You can visually see the difference when you compare the two.

Static menu

Website - http://aseomedia.com

Hello @uzi012,

I have just tried to replicate your issue on my localhost, but it works fine on my end.

Can you please select Static menu and let me know?

Kind Regards, Roman.

Hi @Roman,

Thanks for getting back to me. I just selected the static menu and it has done the same thing. You can view it now as i have left it that way.

http://aseomedia.com

Hi @Roman,

I noticed that when i am logged into WP admin and visit my site, the problem does not occur but when i view it like a normal visitor would view it, the problem occurs.

Hello @uzi012,

I have just checked the header on your website and it looks fine.

Can you please try to clear browser cache if you still see that issue?

Kind Regards, Roman.

Clearing the cache didn’t do anything.

I found a thread that suggests adding a css code. i added this as shown below.

And what that does is when i select the sticky menu, the pages have a static menu due to the code which is what i want but the front page remains with a sticky menu. So the code resolved part of the problem for the rest of the pages but not the front page.

When i select the static menu, the front page menu is static but the rest of the pages mess up by going behind the menu as shown in the screenshots.

Without the code,selecting a static menu does the job for the front page but not the rest of the pages.

This is confusing and frustrating as i don’t understand why this happens even after extensive research and trial and errors. Something’s not right.

Sorry i missed out the code.

.site-header.static {
    position: static !important;
}

Hello @uzi012,

Please remove that CSS code, select Static menu and let me know.

Kind Regards, Roman.

I’ve removed the CSS code and selected the static menu. The front page is okay, again the rest of the pages are not. The menu and content overlap.

Hello @uzi012,

Please try to use Front Page template only for your front page and Full width page template for other pages.

Please let me know if you need more help.

Kind Regards, Roman.

Hi there @Roman,

I’ve tried that before.

Tried it again afte ryour suggestion. The page turns out like shown in the links below.

Top of page - http://aseomedia.com/wp-content/uploads/2016/11/2016-11-28.png
Bottom of page - http://aseomedia.com/wp-content/uploads/2016/11/2016-11-28-1.png

Hello @uzi012,

Please try to do the following in order to resolve that.

Go to your Dashboard → Appearance → Customize → General and reduce top/bottom padding.

Kind Regards, Roman.

Hi @Roman,

It doesnt work out well as it is easily seen behind the menu area, especially the page name as shown in the screenshots below.

What i’ve done for the moment is remove the css code and selected the sticky menu with all the pages having the front page template. What this does is it keeps the front page with a sticky menu and the rest with a static menu.

Top - http://aseomedia.com/wp-content/uploads/2016/11/2016-11-29-2.png
bottom - http://aseomedia.com/wp-content/uploads/2016/11/2016-11-28-1.png

Hello @uzi012,

Please try to use the following CSS code.

You can add CSS code to your site with Simple Custom CSS plugin (just copy CSS code and paste it in Dashboard → Appearance → Custom CSS after installing and activating the plugin). Also you can add CSS code directly to style.css file of your child theme.

body.home header#masthead.site-header.fixed.float-header {
    position: static;
}

Kind Regards, Roman.

Hi @Roman,

That did the trick, thank you.

Why did this problem occur though. Shouldn’t it be simple to just select the sticky or static menu?

I have to select the sticky menu to get a static menu for the rest of my pages, its backwards.

Yes @uzi012, it definitely should work.

And it does work on my localhost, I’m not sure why that option doesn’t work properly on your website. It might be caused by some custom CSS code or other modification. Anyway, I don’t think that the reason can be found without deep inspection.

Kind Regards, Roman.

@Roman,

Thank you for you help.

You are welcome @uzi012,

Please feel free to ask any other questions that you might have in future.

Kind Regards, Roman.