Products not centered on some screen sizes

Store Design
1

Hello,

when viewing a site with multiple products, the individual products are usually centered in the middle of the screen, with the gaps on the left/ right side being equally big. On some mobile devices/screen sizes, however, the products aren’t centered but are aligned with the left end of the page.
Screenshots below for reference.

Centered products:

centered-products.png
centered-products.png1912×736 139 KB

Left-Aligned products:

left-aligned-products.png
left-aligned-products.png979×524 44.4 KB

Kind regards

1 Like
2

@YBodv

Sorry you are facing this issue, it would be my pleasure to help you.

Welcome to the Shopify community! :blush:
Thanks for your good question.

Please share your site URL,
I will check out the issue and provide you a solution here.

3

Hi @YBodv ,

Please send your site and if your site is password protected, please send me the password. I will check it.

4

Hello,
thank you for your response.
This is the site URL: https://www-odv-shop-de.myshopify.com
The error is present in all categories (for example in “https://www-odv-shop-de.myshopify.com/collections/speiseole”) except the “start” category.

You will be able to see the alignment error easily when you resize your browser window, forcing the page to reformat the elements.

Kind regards

1 Like
5

@YBodv

can you try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/base.css ->paste below code at the bottom of the file.
ul#product-grid {justify-content: center;}
1 Like