Site logo position in header

Hello,

I would like to adjust the site logo position in the header so it could be more on the left side (the idea is it would be on the trunk on 13" screens), I tried different things such as

.custom-logo {
padding-left: 0px; !important
}

But it doesn’t move the logo enough…

Could you help me with that please ?

Thank you,
Vic

Oops I forgot to put the link :slight_smile:

Hello Vic,

Can you please provide some explanatory screenshots?

You can upload screenshots to your WordPress Media Library and share a link, or you can use one of the online screenshot services.

Kind Regards, Roman.

Hi Roman, yes sure

here is the picture of the website now, I would like that the logo in 1 moves on the left on 2.

IMAGE

Thanks,
Vic

Hello Vic,

Please try to use the following CSS code.

You can add CSS code to your site with Simple Custom CSS plugin (just copy CSS code and paste it in Dashboard → Appearance → Custom CSS after installing and activating the plugin). Also you can add CSS code directly to style.css file of your child theme.

@media only screen and (min-width: 1025px) {
    header#masthead > div.container {
        width: 100%;
    }
}

Please feel free to ask any other questions that you might have.

Kind Regards, Roman.

Hello Roman,

Thank you, it makes the trick, it doesn’t go enough on the left side to be totally on the trunk but it’s already good enough. The logo is more visible like that. (I tried to change the 100% and the 1025px to see what happen, but your proposition is the best)

Thank you again for your efficiency and helpfulness,
Victor

You are welcome Victor!

And have a nice day :slight_smile:

Kind Regards, Roman.

P. S.
Please try to use this custom CSS code instead of previous in order to move logo to the left side even more:

@media only screen and (min-width: 1025px) {
    header#masthead > div.container {
        width: 100%;
    }

    header#masthead a.custom-logo-link > img.custom-logo {
        margin-left: 0;
    }

    header#masthead div.site-branding {
        padding-left: 0;
    }
}

Amazing !!! It’s perfect with the new CSS, exactly on the right place. Fabulous, have a wonderful day Roman! :slight_smile:

Great! :slight_smile:

Kind Regards, Roman.