How to make your web page tables mobile friendly

Click to edit the webpage hosting the table. Within the text editor, right click the table and select "Table properties". In the properties dialogue box that opens click the "Advanced" tab at the top. Paste into the "Stylesheet Classes" field:
tx1_stack_if_mobile

Click OK, and save the page.

How To Group Your Tables And Buttons Together On Your Mobile Site

Tables are a great way of grouping information, buttons and images together to look beautiful on your website. However, on a mobile site, your table will need to stack to fit and work on the screen therefore you might find that your table looks like the image below i.e. rather than the button displaying underneath each image, all the buttons are grouped together beneath all the images.

To avoid this happening, go to My Websites > Main > Pages > Edit Web Pages and select the page you want to edit and create a table for your content, so click on the table icon in the rich text editor toolbar.

To keep your content and images grouped together on your mobile site, they need to share the same cell of a table. We only need one row but you can use as many as you need. Then click OK.

Now that you've created your table, add your image. Put your cursor in a cell of your table and click on the image icon in the rich text editor toolbar.

Click on FIRST: Upload Image or Choose from Library, either upload or select the image you want to display and click OK.

Create your button in the SAME cell as your image. To create your button click on the button icon in the rich text editor toolbar.

Add in the text for your button, a URL for the button to link to, your font size, border radius and button colour and then click OK.

Click save all. Your table should then look beautiful when viewed on desktop and mobile devices.