How to keep a different page width for content pages on Desktop & Mobile ?

Solved
ShabanaYasmin
New Member
3 0 0

Hi, I'm using Icon Theme. Home & product pages are fine but Content page width is an issue.

There is a setting to change page width to THIN or FULL but it applies to both desktop & mobile.

Thin looks good on Desktop but not on Mobile & full width is better on Mobile but not Desktop.

So I want to keep page width Thin on Desktop & full width on mobile. How can I do that ?

Page Link - https://www.streefb.com/pages/video-tutorials

Thin

ShabanaYasmin_1-1620118798974.png

 

0 Likes
Natztech
Shopify Partner
646 176 432

This is an accepted solution.

@ShabanaYasmin  please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (min-width: 999px){
#shopify-section-page-template .grid_wrapper {
    display: block !important;
   max-width: 100% !important;
}
}

 

Want to theme customize contact us E-mail : natztech2312@gmail.com
If helpful then please Like and Accept as Solution

PageFly Advanced Page Builder- My favorite drag and drop page builder - Visit the Shopify app store
ShabanaYasmin
New Member
3 0 0

Hi, There's no ( assets/theme.css ) but ( assets/theme.js ) for me.

Still tried adding the code in that but nothing changed.

ShabanaYasmin_0-1620201868556.png

 

0 Likes
ShabanaYasmin
New Member
3 0 0

This is forcing Full-Width on Desktop & Mobile, even if Theme Editor setting is for Thin View.

I want otherwise, force Full-Width but on Mobile only, so I can keep Thin view on Desktop.

0 Likes