How to keep content tables responsive on mobile?

[stellaa]

Hello guys! I’m having difficulty finding out why my cells are being cut on mobile mode. This is for a custom page on the Narrative theme.

I’ve attached a photo below for reference:

I’m thinking there is an error because of the sizing I’ve used on the tables manually?

| MY-TITLE | <br><br><br><br>We encourage everyone to make more conscious choices because we believe that small conscious choices are better than none at all. At Sunnysix Active, we are taking action by providing consumers with sustainable options. As a conscious and sustainable brand, we commit to making more environmentally conscious and ethical decisions throughout the whole process. With the goal of challenging the fast fashion industry and ultimately driving the industry towards a sustainable future, we have partnered with a non-profit organization and eco-fashion manufacturere who share the same commitment. <br><br> |
| - | - |

| TITLE-2 | <br><br><br><br>P100 from every piece purchased will go to ocean cleaning initiatives by Healthy Seas. By donating an amount from every piece purchased, we are able to help Healthy Seas achieve its mission of recovering harmful waste from our seas and preventing even more from ending up in the marine ecosystem. Help us clean our seas and save marine wildlife! <br><br> |
| - | - |

Would really appreciate any form of help!

Thanks!

website: https://sunnysixactive.com/pages/sustainably-produced

password: heystella

[KetanKumar]

@stellaa

Thanks for it

can you please sent particular page url so i will guide you

[stellaa]

@KetanKumar

Hi ketan. thanks for your help. you can access it here.

https://sunnysixactive.com/pages/sustainably-sourced

password: heystella

[Kinjaldavra]

→ Go to Online Store->Theme->Edit code
→ Asset->/theme.scss.liquid->paste below code at the bottom of the file.

@media only screen and (max-width: 750px)
.grid .grid__item {
    
    padding-right: 10px;
}
}

[KetanKumar]

@stellaa

Thanks i think look now fine