Title: Table Width Last modified: August 20, 2016 --- # Table Width * Resolved [Wendy](https://wordpress.org/support/users/gwade/) * (@gwade) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/) * Hi, I have set up a table yet the width is too wide, how do I ensure that there is no padding in the cells and that it fits into the width allowable on my wordpress site. In Firefox the table clashes with the widgets on the side. * Thanks Grant * [http://wordpress.org/extend/plugins/tablepress/](http://wordpress.org/extend/plugins/tablepress/) Viewing 15 replies - 1 through 15 (of 124 total) 1 [2](https://wordpress.org/support/topic/table-width/page/2/?output_format=md) [3](https://wordpress.org/support/topic/table-width/page/3/?output_format=md) … [7](https://wordpress.org/support/topic/table-width/page/7/?output_format=md) [8](https://wordpress.org/support/topic/table-width/page/8/?output_format=md) [9](https://wordpress.org/support/topic/table-width/page/9/?output_format=md) [→](https://wordpress.org/support/topic/table-width/page/2/?output_format=md) * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348881) * Hi Grant, * thanks for your question. * Please post the link to the table in question, and I will try to make suggestions. Note, that it’s not always possible to make a table fit, e.g. if the contents in the cell simply require a certain minimum width, due to their own width. * Regards, Tobias * Thread Starter [Wendy](https://wordpress.org/support/users/gwade/) * (@gwade) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348887) * Hi Tobias * It seems to work fine in internet explorer but not in firefox [http://www.wellandhealthy.com](http://www.wellandhealthy.com) * Thanks Grant * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348909) * Hi, * thanks for the link. * It works for me in Chrome, but you are right, in Firefox, it causes trouble. To fix that, I suggest that you remove the padding, margin, and border around images in tables. To do that, please add * ``` .tablepress-id-1 td img { border: none; padding: 0; margin-bottom: 0; } ``` * to the “Custom CSS” textarea on the “Plugin Options” screen of TablePress. * Regards, Tobias * Thread Starter [Wendy](https://wordpress.org/support/users/gwade/) * (@gwade) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348910) * Thanks Tobias, * That has reduced the spread slightly on Firefox. I may try and reduce the size of the graphics so they fit in properly. * Thanks for you help. * Regards Grant * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348912) * Hi Grant, * ah, my bad, there’s a typo in my code above. “none” for the padding should be“ 0”. I fixed that in my code above. Please try that again. Additionally, please remove all the other “Custom CSS” that you already have (to the set the column and table widths), as is not used anyway, due to the size of the images. Your“ Custom CSS” should be * ``` .tablepress-id-1 td img { border: none; padding: 0; margin-bottom: 0; } ``` * and nothing else. You should then not have to reduce the image size by hand. * Regards, Tobias * Thread Starter [Wendy](https://wordpress.org/support/users/gwade/) * (@gwade) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348915) * Hi Tobias * Thanks brilliant, it works fine now. * Exellent support!! * Regards Grant * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3348917) * Hi Grant, * awesome, great to hear that this worked 🙂 Thanks for the confirmation. * Best wishes, Tobias * P.S.: In case you haven’t, please rate the plugin here in the plugin directory. Thanks! * [jimchicago](https://wordpress.org/support/users/jimchicago/) * (@jimchicago) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3349066) * Hi Tobias, * I have migrated from WP-Table-Reloaded to TablePress and it’s generally working fine for me. I’ve been able to change the column widths of this table but overall the table is still wider than I want it to be: [http://www.themarketingquiz.com/retirement-plans](http://www.themarketingquiz.com/retirement-plans) * How can I make the table’s width equal (or very close to) the sum of the two column widths? * Also, I would like to add a 1px border to the whole table and (if possible) give each column its own color instead of each row. * I searched the plugin’s FAQ and Documentation but have not found these answers... so thanks in advance for your help. * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 5 months ago](https://wordpress.org/support/topic/table-width/#post-3349067) * Hi, * thanks for your question. * At first, you’ll want to disable the usage of the JavaScript library, by unchecking the “Use DataTables” checkbox on the table’s “Edit” screen, instead of just unchecking the individual features. After that, you can use this “Custom CSS” to make the table smaller, i.e. to make it as wide as its contents: * ``` .tablepress-id-1 { width: auto; } ``` * To add a border around the cells, you can use * ``` .tablepress-id-1 thead th, .tablepress-id-1 tbody td { border: 1px solid #333333; } ``` * In order to give colors to the columns and not the row, you should at first decide, whether you want to use the “Alternating row colors” feature, as that makes things more complicated here. If you don’t want it, just uncheck the corresponsing checkbox on the “Edit” screen. Then you can use this “Custom CSS” * ``` .tablepress-id-1 .column-1 { background-color: #ff0000; } .tablepress-id-1 .column-2 { background-color: #00ff00; } ``` * Regards, Tobias * [jimchicago](https://wordpress.org/support/users/jimchicago/) * (@jimchicago) * [13 years, 4 months ago](https://wordpress.org/support/topic/table-width/#post-3349076) * Thank you, Tobias! Those CSS snippets certainly help. However, even after adding the first one you gave, only the first (L-hand) column in the table is the width I specified in this snippet: * ``` .tablepress-id-1 .column-1 { width: 220px; } .tablepress-id-2 .column-2 { width: 260px; } ``` * The second column seems to be collapsing to the width of the longest line of text in it. For that reason I have inserted a string of periods (…………) to make the table the width I want it to be. But there must be a better way than this to get that table width (can you tell me what it is?): [http://www.themarketingquiz.com/retirement-plans/](http://www.themarketingquiz.com/retirement-plans/) * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 4 months ago](https://wordpress.org/support/topic/table-width/#post-3349077) * Hi Jim, * the column width of the second column is not changing because of the second part of the CSS has the wrong table ID, `2` instead of `1` 🙂 Please try again with * ``` .tablepress-id-1 .column-1 { width: 220px; } .tablepress-id-1 .column-2 { width: 260px; } ``` * With that, you won’t need the `.....` * Regards, Tobias * [jimchicago](https://wordpress.org/support/users/jimchicago/) * (@jimchicago) * [13 years, 4 months ago](https://wordpress.org/support/topic/table-width/#post-3349078) * What a kind fellow you are . . . and how foolish I feel for (once AGAIN) not noticing the obvious! Yes, changing that one character made all the difference. Thank you Tobias, you certainly embody the spirit of this forum: * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 4 months ago](https://wordpress.org/support/topic/table-width/#post-3349080) * Hi, * no problem, you are very welcome! And don’t worry, these small things happen to me all the time 🙂 Oh, and thanks for the song! 🙂 * Best wishes, Tobias * P.S.: In case you haven’t, please rate the plugin here in the plugin directory. Thanks! * [arrancscott](https://wordpress.org/support/users/arrancscott/) * (@arrancscott) * [13 years, 4 months ago](https://wordpress.org/support/topic/table-width/#post-3349088) * Hi Tobias, * I’ve read through the advice you’ve given the other members on here and implemented that in to my ‘Custom CSS’ field but the table width still hasn’t adjusted and is clashing with my sidebar widgets. The website i’m working with is conference- call-providers.co.uk and i’m testing it on Firefox. The table is on the main page. (it’s working fine with all other browsers) * Any help greatly appreciated * p.s – my id is table2 as well and i’ve also changed that with no luck. * Thanks Arran * Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * (@tobiasbg) * [13 years, 4 months ago](https://wordpress.org/support/topic/table-width/#post-3349089) * Hi Arran, * thanks for your post. * One reason for this might be how the Shortcode is inserted in the page. You probably used the Visual Editor. That unfortunately has the bad habit to make the HTML code to complex. Please switch to the “Text editor” tab on the page’s “Edit” screen in the admin area, and check if the `[table ...]` Shortcode is on its own line, with an empty line before and after it. * Then, it also appears that Firefox does not add a line break/word wrap in the“ DIAL-OUT?” column, while other browsers do. Thus, please add a line break after the hyphen in that cell, manually, by just pressing “Enter” there. * Regards, Tobias Viewing 15 replies - 1 through 15 (of 124 total) 1 [2](https://wordpress.org/support/topic/table-width/page/2/?output_format=md) [3](https://wordpress.org/support/topic/table-width/page/3/?output_format=md) … [7](https://wordpress.org/support/topic/table-width/page/7/?output_format=md) [8](https://wordpress.org/support/topic/table-width/page/8/?output_format=md) [9](https://wordpress.org/support/topic/table-width/page/9/?output_format=md) [→](https://wordpress.org/support/topic/table-width/page/2/?output_format=md) The topic ‘Table Width’ 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/) * 124 replies * 21 participants * Last reply from: [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/) * Last activity: [12 years, 6 months ago](https://wordpress.org/support/topic/table-width/page/9/#post-3349248) * Status: resolved