Docs

[fatheaddrummer]

Hi There,

Could you help me out, aligning my logo and my menu?
I tried several css from the forum, but nothing worked really. I want the bottom of my menu to be in the same line as the bottom of my logo, in order to save some space in the header. Thanks! 🙂

https://www.diamond-precision-studio.com/en/online-drumming/

[fatheaddrummer]

Solved! But now I have another issue,

I’ve added the following lines, to make it transparenet, but only the half of the navbar is transparent now….I don’t know what’s the issue here. Could you help me out?

.x-navbar .x-brand {
margin-top: 0;
}
.x-navbar {
    background-color: transparent;
}

.x-navbar.x-navbar-fixed-top {
    background-color: white;
    height: 80px;
}

.x-navbar.x-navbar-fixed-top .x-brand {
width: 200px;
}

.x-navbar.x-navbar-fixed-top  .x-nav > li > a {
    padding-top: 30px !important;
}

Thanks a lot! 🙂

https://www.diamond-precision-studio.com/en/online-drumming/

Best, Christian

[Christopher]

Hi there,

Please add this code as well :

@media (min-width:979px){
.page-id-8406 div#x-content-band-1 {
    margin-top: -31px !important;
}
}

Hope it helps.

[fatheaddrummer]

That helped great!
Thank you very much!! 🙂

[fatheaddrummer]

Unfortunately I realized there is another related issue…
How is it possible, that the header looks different on these two pages?

https://www.diamond-precision-studio.com/en/mixing-online/
https://www.diamond-precision-studio.com/de/online-drumming/

Thanks a lot!

Best, Christian 🙂

[Thai]

Hi There,

Please update the previous CSS a bit:

@media (min-width:979px){
    .page-id-8406 div#x-content-band-1,
    .page-id-86 div#x-content-band-1 {
        margin-top: -31px !important;
    }
}

Hope it helps 🙂

[fatheaddrummer]

Hi Thai,

That is great, thank you very much!!

Is it possible to add this to all pages? I will need it on all pages.

Thank you so much for the great support!

Best, Christian

[Thai]

In this case please try with this CSS:

@media (min-width:979px){
    #x-content-band-1 {
        margin-top: -31px !important;
    }
}

Hope it helps 🙂

[fatheaddrummer]

Wow, you are so great!
That helped! Thanks!

Could you tell me, why the menu on this page is floating and on the other page not?
https://www.diamond-precision-studio.com/en/mixing-online/
https://www.diamond-precision-studio.com/de/online-drumming/

Thank you so much!

Best, Christian

[Thai]

Hi Christian,

Could you send me some screenshots?

Thanks.

[fatheaddrummer]

Ups,

I found the issue myself at this moment! 🙂

Do you have any idea how I can leave the navbar transparent when I am scrolling?
Also It gets a little bit bigger at the moment, when it start to scroll. Could we just leave it the same size?
Thank you very much!

Best, Christian

[Thai]

Hi ,

Please find this CSS under Customizer > Custom > Global CSS:

.x-navbar.x-navbar-fixed-top {
    background-color: white;
    height: 80px;
}

And change to this:

.x-navbar.x-navbar-fixed-top {
    background-color: transparent;
    height: 69px;
}

Hope it helps 🙂

[fatheaddrummer]

That helps indeed Thai! 🙂 You are my personal hero! Thank you so much!

Last question:
Can we center the menu in hight? So, it is in the middle and in one line with the button and the logo?

Thank you so much!

Best, Christian

[Thai]

Hi There,

Please add this CSS:

@media (min-width: 980px){
    .x-navbar .ubermenu .ubermenu-target {
        line-height: 69px;
        padding-top: 0;
        padding-bottom: 0;
    }
}

Regards!

[fatheaddrummer]

Wow, Thai, that looks great! Thank you very very much!

Best, Christian 🙂

[Author]

Posts