Docs

[kearneycreativegr]

I want to make my header invisible so that I can have my video playing and have the logo and menu just sitting over it. Right now I have it setup like the image shows that is attached.

Thanks in advance for your help!

[Christopher]

Hi there,

Your attachment didn’t upload, please try again.
Please provide us with your website URL.

Thanks.

[kearneycreativegr]

http://www.kearneycreative.com/

I want to make the header transparent so that the header logo and menu sit on top of the top image, is this possible?

[Rahul]

Hey There,

Thanks for writing in!

Please add this CSS at Appereance > Customizer > Custom > CSS :

.x-navbar-inner {
background-color: transparent !important
}

Hope this helps, let us know how this goes!

[kearneycreativegr]

It didn’t change anything once entered. Any suggestions?

Website:
http://www.kearneycreative.com

[Joao]

Hi there,

Please remove the previous code and add the following code:

Please add the following code to Appereance > customizer > Custom > CSS

.x-navbar {
    background: none;
    border: none;
    margin-bottom: -63px;
}

Thanks

Joao

[kearneycreativegr]

How do I fix this issue with mobile menu?

[kearneycreativegr]

and is there also a way that the desktop version stays clear when at the top but as you scroll down it turns to have a background color?

[Thai]

Hi There,

Please add the following CSS:

@media (max-width: 979px){
    .x-navbar {
        margin-bottom: 0;
    }
}
.x-navbar .mobile .x-nav li a {
    color: #000;
}
.x-navbar.x-navbar-fixed-top {
    background-color: rgba(255, 255, 255, 0.7)
}

Hope it helps 🙂

[kearneycreativegr]

Still running into issues with the mobile menu!

[Thai]

Hi There,

Please update the CSS to:

@media (max-width: 979px){
    .x-navbar {
        margin-bottom: 0 !important;
    }
}
.x-navbar .mobile .x-nav li a {
    color: #000;
}
.x-navbar.x-navbar-fixed-top {
    background-color: rgba(255, 255, 255, 0.7)
}

[kearneycreativegr]

Is it possible to make the header in mobile transparent like it is in desktop mode.

[Joao]

Hi There,

Please remove the following code:

@media (max-width: 979px){
    .x-navbar {
        margin-bottom: 0 !important;
    }
}

Hope it helps

Joao

[kearneycreativegr]

Exactly What I needed! But now when I drop down the mobile menu the color that shows up doesn’t go all the way to the bottom of the menu? Also how do I change the color?

[Rad]

Hi there,

Negative margins shouldn’t be used as much as possible when not really needed. It causes the chain of issues to the layout. Relative positioning is there for that reason. But since it’s already there, let’s add this CSS too.

@media (max-width: 979px) {
.x-nav-wrap.mobile.collapse.in {
    display: block;
    padding-bottom: 63px;
}
}

That should fix it, it will negate the previous negative margin. Make sure you don’t remove the negative margin.

Thanks!

[Author]

Posts