FROM CACHE - en_header

Having trouble with a table on mobile view and certain desktops browser sizes.

New Member
2 0 1

Hey all 

Im having an issue with a table that wont automatically resize itself on mobile view. Anyone know an answer for me? Much thanks in advance


Heres my site and page I am having the issue with;


Replies 4 (4)
Shopify Partner
835 73 164

Hi @mreddy64 

Hope you're having a great day!

First of all, your store has some JavaScript errors:


The problem you raise is not related to your whole site but only to the table on the page. You will need a CSS code to make the table responsive.

Add the CSS code by following the steps below:

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


#content .page_content tr:nth-child(even) {
    background-color: #f2f2f2;

#content .page_content .table-1 {
    overflow-x: auto;


See end result below on mobile browser:

Table with scroll barTable with scroll bar

New table on large screenNew table on large screen

New Member
2 0 1

Thanks for the reply - I dont have the matching asset you listed. If it makes a difference I am using a theme purchased from a website - it is not a standard shopify theme. 
The only links with a ".scss" are nav.scss.liquid and gift-card.scss.liquid

Any help is greatly appreciated



5 0 2

Hi I'm having a similar issue.


My table looks great on desktop but looks weird on mobile (image attached)


Is there any code that I can apply to this page only? 

New Member
4 0 0

I decided to use an HTML responsive table generator instead. Put everything in and copy the html code to the page on shopify. Worked perfectly.