Title: Responsive Collapse Last modified: February 6, 2019 --- # Responsive Collapse * Resolved [stephaniesash](https://wordpress.org/support/users/stephaniesash/) * (@stephaniesash) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/) * I’m making tables with only three rows and two columns. Is there a code I can use for the responsive collapse to get rid of the collapse button and make the 2nd column always viewable? Thank You Viewing 11 replies - 1 through 11 (of 11 total) * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11174389) * Hi, * thanks for your post, and sorry for the trouble. * I don’t understand. If you get rid of the collapse button, and make the second column always visible, there’s nothing actually collapsing anymore?! It would just be the full table again? * Regards, Tobias * Thread Starter [stephaniesash](https://wordpress.org/support/users/stephaniesash/) * (@stephaniesash) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11175621) * Hello, thanks for the response and sorry for the confusion. Yes, in mobile view I would like to get rid of the collapse button so column B is always visible underneath column A. So for my small tables column 1 is the header, column 2A will be an Image and 2B will be a short description under the image but always visible. Next is column 3A with 3B underneath and so on. Thank You for any help. * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11176086) * Hi, * ah, thanks for the explanation. For this you would need a different approach, based on CSS code. So, instead of using the `collapse` mode, please add this to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress: * ``` @media screen and (max-width: 768px) { .tablepress-id-123 thead th, .tablepress-id-123 tbody td { display: block; } } ``` * The table ID needs to be adjusted to your table’s ID here. * Regards, Tobias * Thread Starter [stephaniesash](https://wordpress.org/support/users/stephaniesash/) * (@stephaniesash) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11177326) * I’m not sure if I’m doing something wrong but I didn’t work. I added the above CSS code to the plugin options page as you said. I already have over 500 tables and I wasn’t sure if needed to change the table id # for each one. To start I saved the above code exactly like you said and checked the page that had table 123 in it. I tried these in the page all with no luck. * [table id=123 /] * [table id=123 responsive=scroll /] * [table id=123 responsive=collapse /] * Sorry If I’m missing something easy….. Stephanie * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11178569) * Hi Stephanie, * for the CSS code from my previous code, the Shortcode * ``` [table id=123 /] ``` * would be correct (all with the correct and matching table ID). * If it still doesn’t work, can you please post a link to the page with the table where this problem happens, so that I can take a direct look? Thanks! * Regards, Tobias * Thread Starter [stephaniesash](https://wordpress.org/support/users/stephaniesash/) * (@stephaniesash) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11182549) * Hello, Tobias Thank You for your response. This is the CSS code I put on line# 1 of the plugin options custom CSS * [@media](https://wordpress.org/support/users/media/) screen and (max-width: 768px){ * .tablepress-id-123 thead th, .tablepress-id-123 tbody td { display: block; } * } * Here is the link of the page that has Table ID 123. * [http://stadiumstay.com/listing/washington-redskins-hotels-fedexfield/](http://stadiumstay.com/listing/washington-redskins-hotels-fedexfield/) * On that page, I put 2 table shortcodes so that you can see them both. This is the first [table id=123 /] * and this is the second [table id=123 responsive=collapse /] * No matter what I do or try I can’t get that first table to have column B always visible under column A. Also I have about 500 tables. Is there a CSS code I can use that will work with all of them at once or do I have to put one code in custom CSS for each table ID? Thank You Again….. Stephanie * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11182908) * Hi, * it seems like the TablePress CSS files are not updating properly on your site, probably due to file access rights on the server. Could you therefore please log in via FTP and delete the three files /wp-content/tablepress-custom.css / wp-content/tablepress-custom.min.css /wp-content/tablepress-combined.min.css on your server and then save the “Custom CSS” again? * After that, the table layout should change on small screens, as expected. * If you really want to apply this code to ALL tables on the site, you could use the code * ``` @media screen and (max-width: 768px) { .tablepress thead th, .tablepress tbody td { display: block; } } ``` * Note how this doesn’t have a table ID in it, so that it applies to all tables. * Regards, Tobias * Thread Starter [stephaniesash](https://wordpress.org/support/users/stephaniesash/) * (@stephaniesash) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11183304) * Ok Thank You for all your help. I will try it as soon as I can figure out why I can’t connect to the server in FileZilla. If anyone can help me figure out this error code they would be my hero. fzSftp started, protocol_version=8 Connection timed out after 20 seconds of inactivity Error: Could not connect to server * I will let you know if it works after I figure this out. I’ll have to do some research tomorrow to figure this out. Thanks again, you’ve gone above and beyond * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [7 years, 3 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11183540) * Hi, * sorry, I have idea about these FTP issues, that’s just not my area of expertise. * Regards, Tobias * Thread Starter [stephaniesash](https://wordpress.org/support/users/stephaniesash/) * (@stephaniesash) * [7 years, 2 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11225313) * That Worked PERFECTLY! Thank You SO Much!!! * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [7 years, 2 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11225619) * Hi, * no problem, you are very welcome! 🙂 Good to hear that this helped! * Best wishes, Tobias * P.S.: In case you haven’t, please [rate TablePress](https://wordpress.org/support/plugin/tablepress/reviews/#new-post) here in the plugin directory. Thanks! Viewing 11 replies - 1 through 11 (of 11 total) The topic ‘Responsive Collapse’ is closed to new replies. * ![](https://ps.w.org/tablepress/assets/icon.svg?rev=3192944) * [TablePress - Tables in WordPress made easy](https://wordpress.org/plugins/tablepress/) * [Frequently Asked Questions](https://wordpress.org/plugins/tablepress/#faq) * [Support Threads](https://wordpress.org/support/plugin/tablepress/) * [Active Topics](https://wordpress.org/support/plugin/tablepress/active/) * [Unresolved Topics](https://wordpress.org/support/plugin/tablepress/unresolved/) * [Reviews](https://wordpress.org/support/plugin/tablepress/reviews/) * 11 replies * 2 participants * Last reply from: [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * Last activity: [7 years, 2 months ago](https://wordpress.org/support/topic/responsive-collapse-2/#post-11225619) * Status: resolved