How to center logo on mobile display

Hello. I need help centering the logo because on mobile its a little offset to the left.

1 Like

Hi @tmitch

The logo is already centered, do you want to move a bit to the left?

If it is check this one.

From you Admin page, go to Online Store > Themes

Select the theme you want to edit

Under the Asset folder, open the main.css(base.css, style.css or theme.css)

Then place the code below at the very bottom of the file.

@media only screen and (max-width: 749px){
.header {
    display: grid;
    grid-template-columns: 1fr 2fr 2fr;
    align-items: center;
}
}

And Save.

Result:

Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!

Yes that would be great if you can !

Hi Tmitch,

You have the search icon on the right in between the logo and the cart which is making the logo look slightly on the left. Also, your theme header is not using the full width of the screen. You can remove/disable search icon in the header and instead add it as a menu item in the Main navigation and as a linked list item in the footer.

Please DM, if you need help with the same.

Thanks