How to apply custom CSS padding rule only to desktop?

Solved
Mathias8hrS
Excursionist
42 0 13

Hi,

For my webshop, I'm trying to adjust the padding of my shopify reviews on the product pages for the desktop version of the site, for which I added the following code to my theme.scss.liquid file:

#shopify-product-reviews > div {
    padding-left: 150px;
  padding-right: 150px;
}

However, I want this padding to only be applied on the desktop website version, and not on the mobile version (where I don't want any padding at all). What should I add to the code in order for it to NOT apply on mobile but only on desktop?

Thank you in advance.

Kr,

Mathias

0 Likes
Guleria
Shopify Partner
1781 376 531

This is an accepted solution.

Use with media query

@media screen and (min-width: 900px) {
#shopify-product-reviews > div {
    padding-left: 150px;
  padding-right: 150px;
}
}
Want to modify or custom changes on store hire me.
Email: guleriathakur43@gmail.com, Skype: navrocks1
If helpful then please Like and Accept Solution.
Buy me a coffee ☕ My PayPal
Mathias8hrS
Excursionist
42 0 13

@Guleria Cheers! That worked smoothly

0 Likes