I am a premium user. I have problems with a table which does not resize on iPhone 6. The site you can check is www.jh-waterway.com, which has a table created from The tinyMCE editor. Submenu is “Benefits”. Since table edge line was not displayed, I used the vantage child to draw the cell box line. It does not work without the child theme either.
I checked the previous thread which posted in about 3 months ago. The answer was that Vantage is not resizing the table properly. You suggested that we can make multiple columns with siteOrigin button widget. I tried it, but it was not suitable for many rows and columns.
Could you suggest any other ways or plugin to create the table which can be response?
I use a lot of tables.
Thanks,
Brian
Hi Brian
To set an overall background color for your tables in Vantage, please try the following under Appearance > Custom CSS:
#main table { border: 1px solid #2f3033; } #main table th, #main table td { border: 1px solid #2f3033; padding: 0.5em; } @media (max-width: 480px) { #main table th, #main table td { padding: 2%; } }Adjust as required.
What I did there was shift the table padding from fixed to percentage based for devices under 480px resolution. It might help. If it doesn’t you might consider removing the width attributes from your table cells and see if that helps.
Responsive tables are tricky. If you’d like to go the plugin route, here are a few you might consider:
https://wordpress.org/plugins/search.php?q=responsive+table