How to fix white space issue in tables on product pages?

Technical Q&A
1

Hi everyone,

I’m having a problem with my theme and the tables that are on one of my pages and on all product pages. As referenced in the images below, it creates this space on the right size of the tables that also casts a drop shadow which gives it a very weird look. I’m using Pixel Unions theme Empire - Supply. My business is https://sizyclothing.com/ which is live right now with the current version and the pages with this problem are my ‘MATERIALS AND SIZING’ page and all product pages. I’ve got basic knowledge of HTML and CSS but a universal fix for this that makes the tables fill that entire space seems to be out of reach for me. Regardless I appreciate anyone’s time who could help out! :slightly_smiling_face:

I hope you’re having a wonderful day!

2

@rainbowconnor ,

Please add this CSS to your theme

table {
    border: none !important;
    box-shadow: none !important;
}

Thanks

3

Hello There,

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset >theme.css and paste this at the bottom of the file:
.table-responsive table tbody {
width: 100%;
}
.table-responsive table td {
width: 20%;
}
4

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.

5

I can’t seem to get this to work. Help please!
https://sustainedfun.com/pages/about-us