Margin Navbar to content area

[basmeijerink]

Hey Themco,

This is the first time I’m posting here. I couldn’t find the answer to my question online so here I am. On my home page, I made my Navbar Transparant because I wanted to play a video in the background. On my other pages, I have a black Navbar but the content of these pages is partly hidden behind the Navbar. How can I make my content on these pages (all except the home page) start below the navbar? Thanks in advance

[christian]

Hey Bas,

I believe you applied a custom CSS that makes the Masthead position absolute and you added the code in Theme Options > CSS. If you’ve built your home page using Cornerstone, transfer the CSS to the page’s Content CSS. The Content CSS is similar to the Global CSS only that it’s applied only to the page and not sitewide.

If you did not create the page using Cornerstone. You need to update the CSS. The current code likely looks like this:

.masthead {
    position: absolute;
    width: 100%;
}

Because the home page has a special body class namely the home class, you can add that to your CSS selector like .home .masthead.

Hope that helps.

[basmeijerink]

Hey, thanks it did! Now all my pages except my homepage have white navbars. How can I change this to black? Without removing the transparant navbar from my homepage?

[jade]

Hi Bas,

Please try adding this code as well:

body:not(.home) .masthead .x-navbar {
    background-color: #000;
}

Hope this helps.

[basmeijerink]

Hey Jade,

Thanks for this it’s working!

[basmeijerink]

I do have an other question. My Shop (by woocommerce) is attached to my navbar. How can I create some spacing here? I can’t seem to figure it out…

[friech]

Hi Bas,

We kindly ask to write your new question on a separate thread to avoid confusion and mixing up of the issue. Please provide us login credentials on your separate thread or turn off the Coming Soon page so we can take a closer look at the site.

Thanks,