Why won't my mobile logo center in the Vantage theme?

Store Design
1

I cannot make the header logo center on mobile, it is adjusted left even though my desktop logo is center. I tried this code:
https://community.shopify.com/c/shopify-design/vantage-theme-mobile-logo-is-not-centered/td-p/1468036

It didn’t work. Please help.

The store is in draft mode still and can be previewed here:

https://uyv2pak75nawqhe2-1832011.shopifypreview.com

2

Please try this code instead.

@media only screen and (max-width: 980px) {
  #logo img {
    margin: auto;
  }
}
1 Like
3

Hi @kent_uyehara

You can try this code by following these steps:

Go to Online store => themes => actions => edit code and add this code on file theme.liquid before tag

PageFlyVictor_0-1676943164879.png
PageFlyVictor_0-1676943164879.png1600×777 194 KB

Hope this answer helps.

Best regards,

1 Like
4

HI @kent_uyehara ,

Glad to support you today.

You can check out my suggestion below to get your concern resolved:

  1. Go to Edit code on Online Store:

GemPages_0-1676943604100.png
GemPages_0-1676943604100.png400×163 25.3 KB

  1. add my code above the tag on Theme.liquid:

I hope you find the answer helpful.

Kind & Best regards,
GemPages Support Team.

1 Like
5

Hi @kent_uyehara

I hope you are doing good and welcome to the Shopify Community!
I am Santanu from MS Web Designer (Top Rated Shopify Certified Experts and eCommerce Consultant from Singapore).

Please add this css in your bottom of the css file:

@media only screen and (max-width: 980px) {

#logo img {margin: 0 auto;}

}

Regards,

Santanu

1 Like
6

Thanks for the help, I added this to the stylesheet css and it worked. I appreciate it thanks.

7

Thanks for the feedback, the first post worked so I will hold onto this for future reference. Thanks!

8

Thanks for the feedback, the first post worked so I haven’t tried this but will hold onto it for future reference. Thanks!

9

The first post worked so I haven’t tried this but will hold onto it for future reference. Thanks for the help!