Sticky Menu Position

Hi there,

Try this:

.navigation-stick {
    top: 45px !important;
}

Hello,

Worked great!

Thank you much!
cgk

Hello,

I spoke to soon, needs different value to work on mobile and dos not work with hide when scrolling down.
Any ideas?

Thanks again,
cgk

Hi,

Maybe something like this,

}
.sticky-mobile-header {
top: 90px !important;
}

Thanks,
cgk

You'll need to write a media query to increase or decrease the top value on mobile:

@media (max-width: 768px) {
    .navigation-stick {
        top: 90px !important;
    }
}

What about it doesn't work when the nav only appears when scrolling up?

OK,

That css worked for the mobile with 80px.

The hide when scrolling down dose not hide but shows menu when scrolling down on both desktop and mobile.

Thank you,
cgk

Also the top bar diapers when using the side-out menu and not at the top of the screen.

This is what I have so far.

.top-bar {
position: sticky;
z-index: 999;
top: 0;
left: 0;
right: 0;
}
.navigation-stick {
top: 45px !important;
}
@media (max-width: 768px) {
.navigation-stick {
top: 55px !important;
}
}
@media (max-width: 420px) {
.navigation-stick {
top: 80px !important;
}
}
@media (max-width: 320px) {
.navigation-stick {
top: 115px !important;
}
}

Instead of position: sticky;, try position: fixed;

As for the hide when scrolling down, I'd need to see it to come up with the fix.

When I use "fixed" it places menu under top bar unless I scroll down.
I can make you a login if you would please take a look.

https://www.kosirs.com/wp-admin/

I'm getting this message while trying to set the password: Sorry, your request cannot be accepted.

ip block i will disable for CA

Got it.

Add this:

body {
    padding-top: 45px;
}

That will allow you to use position: fixed; instead of position: sticky;

Then instead of top: 45px !important; use margin-top: 45px !important;

That dose allow me to use fixed so the top bar dose not disappear on mobile when using side-out menu but the spacing is off on mobile. The hide when scrolling down dose not work on desktop or mobile.