Nav Bar: I want it fixed to the top but...

Activello
1

Hello,

I want my navigation bar on my blog to be fixed, but whenever I try to put in the normal code (which I can’t remember, I found it on other threads here) to make the bar fixed, it “eats” into my header image. It goes over it for some reason and I’m not sure why.

I would try to manipulate it but like I said, I can’t remember the original coding I used.

My site is divingunderthecover.com

Thanks,
Erica

2

Hi Erica,

I hope you are well today and thank you for your question.

You can try achieving this by adding the following CSS code in the Custom CSS option of your theme on the below path.

Admin Area -> Appearance -> Customize -> Activello Options -> Other -> Custom CSS

nav.navbar.navbar-default {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
}

header#masthead {
    margin-top: 70px;
}

Best Regards,
Movin

3

I used that, but now the nav bar is scrunched to the top and you can’t see it fully…

I attached an image.

4

Please try using the below CSS code instead of above shared.

nav.navbar.navbar-default {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 9999;
}
body.admin-bar nav.navbar.navbar-default {
    top: 32px;
}
header#masthead {
    margin-top: 70px;
}
5

Thank you, thank you, thank you. That worked absolutely wonderful :slight_smile:

Have a good day.

6

You are most welcome here :slight_smile: