Site logo

Archived topic

How do I get my logo to be in the middle?

4 replies · Started by Heath on September 21, 2022

Viewing posts 1–5 of 5

I want everything the same except for the logo to be centered between the social icons and the menu/search.

How do I do that?

Hi Heath,

To clarify, this is for the Desktop view? If so, can you first set the Primary Navigation location to float right?

I don't know about desktop. I'm just looking on my mobile.

You provided css yesterday which worked but the logo isn't center on mobile. I haven't checked desktop yet.

I see. There's margin on the logo. Can you update the code from yesterday to this?:

nav#mobile-header .gb-container.social-icons {
    order: -1;
    margin-right: auto;
}

nav#mobile-header .site-logo.mobile-header-logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    margin:0;
}

nav#mobile-header .site-logo.mobile-header-logo img {
    width: 100px;
    height: auto !important;
}

nav#mobile-header > .inside-navigation {
    position: relative;
    padding-top: 30px;
    padding-bottom: 30px;
}

nav#mobile-header span.menu-bar-item.search-item a {
    padding: 0;
}

That worked! Thank you!

This archived topic is closed to new replies.