Mobile App Table Issues

Solved
ShopBoutiqueen
New Member
2 0 1

Hi,

I'm trying to get the tables on my size guide page to stack and auto-adjust the width on mobile devices but I'm not sure how. The tables have a background color and everything looks good on desktop, but on mobile phones the background gets wonky and you have to scroll sideways to see the whole table. The url for the page is https://shopboutiqueen.com/pages/size-guide, password yourmajesty!

Appreciate any advice on how to fix!

Screen Shot 2021-06-24 at 11.05.48 AM.pngScreen Shot 2021-06-24 at 11.05.39 AM.png

Accepted Solution (1)
dmwwebartisan
Shopify Partner
11515 2438 3529

This is an accepted solution.

@ShopBoutiqueen

 1. In your Shopify Admin go to online store > themes > actions > edit code

2. Find Asset >theme.scss.css and paste this at the bottom of the file:  

@media screen and (max-width:800px) {
#size-guide .rte table {table-layout: auto !important; width: 100% !important;}
}

Thanks!

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 3 (3)
dmwwebartisan
Shopify Partner
11515 2438 3529

This is an accepted solution.

@ShopBoutiqueen

 1. In your Shopify Admin go to online store > themes > actions > edit code

2. Find Asset >theme.scss.css and paste this at the bottom of the file:  

@media screen and (max-width:800px) {
#size-guide .rte table {table-layout: auto !important; width: 100% !important;}
}

Thanks!

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
ShopBoutiqueen
New Member
2 0 1

Thank you so much!

dmwwebartisan
Shopify Partner
11515 2438 3529

@ShopBoutiqueen 

Thank you for your response. It's good to know that it's worked for you. Kindly feel free to get back to me if you need any further assistance.

If helpful then please Like Solution .

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app