Docs

[giveitlegs]

Hi all!

URL: http://gofitfarm2.wpengine.com

I am trying to achieve two things…

1 – I’d like to move all 6 of my menu items up slightly around my centered logo (I am using the ‘logo as a menu item’ hack provided in this forum to center my logo in the middle of the menu – just FYI)

…and then…

2 – I’d like to move the entire menu (logo + menu items) upward slightly to have it sit more centered vertically in the header space.

(see screenshot)

I have tried reducing the height attribute in this code:

@media (min-width: 900px) {
    .x-logobar {
       display: none !important;
       visibility: hidden !important;
    }
    .x-navbar .desktop .x-nav > li.logo-menu-item > a {
        text-indent: -99999px;
        text-align: left;
        width: 200px;
        height: 275px;
        background: url('http://gofitfarm2.wpengine.com/wp-content/uploads/2016/07/Website-Hero-Logo-350x270.png') no-repeat center center;
        background-size: contain;
    }
}

…which was given to me by support here (which by the way is AWESOME! and this code works great!),… but the only problem is that when I reduce the height attribute in it, only the logo moves and the rest of the menu items seem ‘pinned’ to the bottom of the header.

Any thoughts?

Many thanks!

Cheers

[Joao]

Hi There,

You can add some margin to the top of your logo than after go to Appereance > Customizer > Menu and adjust the settings so your top link spacing is smaller.

Please add the following code than adjust the top navbar links as described above.

@media (min-width: 900px) {
.x-navbar .desktop .x-nav > li.logo-menu-item > a {
  
}
}

Hope it helps

Joao

[giveitlegs]

This worked perfectly! Like a charm! That was the solution! thank you soooooooo much!

You guys rock so hard! Killer support! You’re like CSS/Js ninjas!

Cheers!

[Joao]

Thank very much for your kind words.

I am glad we managed to help 🙂

Joao

[Author]

Posts