Align section on product page

MT27
Pathfinder
145 6 10

Hi for some reason when the screen gets bigger the section I have circled in red (multicolumn) moves to the right, can you please help me align it under text like on the laptop for all screen sizes? Thank you

Pass: biangu

Url: www.matibrnd.com

MT27_0-1711560784097.jpeg

 

Replies 2 (2)

BSS-Commerce
Shopify Expert
3477 461 516

Hi @MT27 ,

Please follow these steps:
Step 1: Access Shopify Admin => Online Store => Themes => Edit Code

view - 2024-04-01T144751.581.png

Step 2: Find the file base.css or theme.css.
Image:

view - 2024-04-01T144824.292.png

Insert this code into your CSS file:

@media only screen and (min-width: 1425px) and (max-width: 1508px) {
    #shopify-section-template--18467719414027__a8bd6c37-7476-45f3-b13e-29110c105a73 .grid__item {
      width: 92% !important;
    }
}

@media only screen and (min-width: 1327px) and (max-width: 1424px) {
    #shopify-section-template--18467719414027__a8bd6c37-7476-45f3-b13e-29110c105a73 .grid__item {
      width: 86% !important;
    }
}

@media only screen and (min-width: 1213px) and (max-width: 1326px) {
    #shopify-section-template--18467719414027__a8bd6c37-7476-45f3-b13e-29110c105a73 .grid__item {
      width: 78% !important;
    }
}

@media only screen and (min-width: 1091px) and (max-width: 1212px) {
    #shopify-section-template--18467719414027__a8bd6c37-7476-45f3-b13e-29110c105a73 .grid__item {
      width: 70% !important;
      margin-top: -129px !important;
    }
}

@media only screen and (min-width: 850px) and (max-width: 1090px) {
    #shopify-section-template--18467719414027__a8bd6c37-7476-45f3-b13e-29110c105a73 .grid__item {
      width: 62% !important;
      margin-top: -65px !important;
    }
}

Hope it helps @MT27 

If our suggestions are useful, please let us know by giving it a like or marking it as a solution.

For B2B solutions and custom pricing, check out B2B Solution & Custom Pricing |
For adding product labels/badges, visit Product Labels by BSS

BSS Commerce - Shopify Apps & Store Development Service Provider

Hire a Shopify expert | Shopify Plus Store Development

MT27
Pathfinder
145 6 10

didnt change..

MT27_0-1711968691852.png