How to change the width of the reviews section on MOBILE

[CreatorTim]

Hi, how can I change the width of the reviews section on mobile?

Here’s how it looks on my store:

And I want it to look like this:

So simply, I don’t want it to span across the entire screen.

Here’s a link to a store that looks the way I want it to: https://tomnoske.store/

(Just scroll down, it’s there.)

And here’s my store: https://1049xn-ya.myshopify.com/

(Just scroll down, it’s there.)

As I mentioned, I want this change only for mobile, I want to keep it as it is on desktop.

Thanks a lot!

Tim

[DaisyVo]

Hi @CreatorTim

The review section code appears to come from an application or a JavaScript snippet. Typically, code located within the #shadow-root (open) element cannot be styled directly with CSS.

If this code originates from an app, you may need to contact the app provider for assistance in customizing the CSS. Alternatively, if the code was manually added, you might need to hire a theme developer to review and customize your theme, as this is beyond the scope of our support.

Thank you for your understanding!

[Farhan3]

Hi @CreatorTim ,

Try these steps:

1. From your Shopify admin dashboard, click on “Online Store” and then “Themes”.

2. Find the theme that you want to edit and click on the “3 dots button” on the left side of “Customize” button and then click on “Edit code”.

3. On the left side, in the “Assets” folder, click on “base.css” file, now at the bottom of the file, add the following CSS code:

   @media screen and (max-width: 767px) {
   #shopify-section-template--22711083729161__custom_liquid_wTxmeQ .custom-liquid-section {
     padding: 0 20px;
   }
   }
   

If this helped solve your issue, a Like and Accept as Solution would mean the world to me! If you’d like to go the extra mile, your kind Coffee Tips keep my creativity and dedication brewing! Cheers to creating awesome Shopify solutions together!

[Dan-From-Ryviu]

Hi @CreatorTim

Please add this code to Custom CSS in Online store > Themes > Customize > Theme settings

@media (max-width: 749px) {
#shopify-section-template--22711083729161__custom_liquid_wTxmeQ .custom-liquid-section {
    padding: 0 20px;
}
}

[CreatorTim]

Thans for the feedback brother.

[CreatorTim]

Thank you!

[CreatorTim]

Thank you! Works