How to change desktop width and not mobile width for collections page

Store Design
1

Hi, I added this code for custom css on my collections page and I wanted it to change only the desktop width and not the mobile width. This is the code:

{ margin-top: 30px; margin-bottom: 0px; margin-left: 70px; margin-right: 70px; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; }

Can someone help me with this? I’m using the flex theme and my store link is https://www.luxoptions.com/ but I’m working with an unpublished theme.

1 Like
2

@luxoptions

can you please send your store flex theme url so i will check and guide you or try this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/styles.css ->paste below code at the bottom of the file.
.collection .section__wrapper {
    max-width: 100%;
}
3

hi this didnt work for me. my store url is https://luxoptions.myshopify.com/admin/themes/131066822826/editor?previewPath=%2Fcollections%2Fbest-sellers&section=template–15731674677418__main (the section im working on)

4

@KetanKumar

1 Like
5

@luxoptions

can you please provide screenshot which part do you need full

6

I want the mobile width to be unchanged

Screen Shot 2022-07-10 at 12.02.52 PM.png
Screen Shot 2022-07-10 at 12.02.52 PM.png3584×2023 670 KB

Screen Shot 2022-07-10 at 12.03.23 PM.png
Screen Shot 2022-07-10 at 12.03.23 PM.png3584×2006 483 KB

7

@KetanKumar i want the mobile width to be 100%

1 Like
8

@luxoptions

We have checked for this issue in real system and browserstack but it is working ok. In which system configuration or browser you are checking?

also i can’t see code

9

I checked in chrome

my code for custom css box in collections:

{ margin-top: 30px; margin-bottom: 0px; margin-left: 70px; margin-right: 70px; padding-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; } @KetanKumar
}