Title: Border Radius Table
Last modified: August 22, 2016

---

# Border Radius Table

 *  Resolved [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/)
 * Hello Tobias, meanwhile I ask you thanks for the great plugin!
    I unfortunately
   following your guides on various posts to create a rounding of the edges of the
   table using css to be included in the custom css! but to no avail! Could you 
   lend a hand? thanks! [http://www.circuitovip.it/siracusa/](http://www.circuitovip.it/siracusa/)
 * [https://wordpress.org/plugins/tablepress/](https://wordpress.org/plugins/tablepress/)

Viewing 14 replies - 1 through 14 (of 14 total)

 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5414945)
 * Hi,
 * thanks for your post, and sorry for the trouble.
 * Can you please try this?: [https://wordpress.org/support/topic/round-corners-tables-without-header-and-footer?replies=18#post-5736375](https://wordpress.org/support/topic/round-corners-tables-without-header-and-footer?replies=18#post-5736375)
 * Regards,
    Tobias
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415054)
 * Hello Tobias, thanks for the reply
    I inserted this code .tablepress tbody tr:
   first-child td:first-child { border-top-left-radius: 20px; } .tablepress tbody
   tr:first-child th:last-child { border-top-right-radius: 20px; } .tablepress tbody
   tr:last-child td:first-child { border-bottom-left-radius: 20px; } .tablepress
   tbody tr:last-child td:last-child { border-bottom-right-radius: 20px; }
 * three angles are rounded except in the upper right, also the blue line you see
   in the link I would like to round that as well! thanks
 * [http://www.circuitovip.it/siracusa/](http://www.circuitovip.it/siracusa/)
 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415060)
 * Hi,
 * ah, there’s a small typo in the second block. `th` needs to be `td`.
 * To have the border around the table as well, please see [https://wordpress.org/support/topic/round-table-cornes?replies=8#post-5401288](https://wordpress.org/support/topic/round-table-cornes?replies=8#post-5401288)
   for some better CSS.
 * Regards,
    Tobias
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415071)
 * Thanks Tobias, SOLVED!
    Last Question .. I am creating several tables divided
   into categories you can integrate a combox for recall?
 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415145)
 * Hi,
 * no problem, you are very welcome! 🙂 Good to hear that this helped!
 * I’m not sure what you mean with combobox for a recall here, but if you want to
   easily apply this CSS to more than one table without having to copy it, you could
   use an “Extra CSS class”. For example, replace each
 *     ```
       .tablepress
       ```
   
 * in the CSS with
 *     ```
       .tablepress-round-corners
       ```
   
 * and then add
 *     ```
       tablepress-round-corners
       ```
   
 * into the “Extra CSS classes” field of each table that you want to have that round
   border.
 * Best wishes,
    Tobias
 * P.S.: In case you haven’t, please [rate TablePress](http://wordpress.org/support/view/plugin-reviews/tablepress)
   here in the plugin directory. Thanks!
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415147)
 * Thanks Tobias,
    I just voted for you deserve it! As for the Combobox I found 
   a solution, but I take advantage of a latest info if you look at the link that
   I added: [http://www.circuitovip.it/siracusa/](http://www.circuitovip.it/siracusa/)
   The text inside the cells is not equal for all and create some different margins!
   Is there any way to make them all alike! Thanks
 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 7 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415149)
 * Hi,
 * thanks for the rating, I really appreciate it!
 * The reason for this issue is that the browser applies different column widths.
   To change this, I suggest to use that “Extra CSS classes” approach from above
   and then set the columns widths e.g. with
 *     ```
       .tablepress-round-corners .column-1 {
         width: 350px;
       }
       .tablepress-round-corners .column-2 {
         width: 350px;
       }
       ```
   
 * Regards,
    Tobias
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415278)
 * Hello Tobias, I entered
 * .tablepress-round-corners .column-1 {
    width: 350px; } .tablepress-round-corners.
   column-2 { width: 350px; }
 * in Option Plugin Table Press but the result remains the same ..
    [http://www.circuitovip.it/siracusa/](http://www.circuitovip.it/siracusa/)
 * Please Help Me ! 😉
 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415279)
 * Hi,
 * the code is not working because those tables don’t have the `tablepress-round-
   corners` “Extra CSS class” anymore. You will either have to re-add that (but 
   then maybe use a different name), or apply the CSS to the individual selectors
   like `.tablepress-id-1` instead.
 * Regards,
    Tobias
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415280)
 * I’m sorry I did not understand what Tobias! Forgive me
    Below you pointed to 
   all the changes that I put on css option!
 * .tablepress {
    word-break: normal; }
 * .tablepress .odd td {
    background-color: #EC7C0C; }
 * .tablepress tbody tr:first-child td:first-child {
    border-top-left-radius: 20px;}
 * .tablepress tbody tr:first-child td:last-child {
    border-top-right-radius: 20px;}
 * .tablepress tbody tr:last-child td:first-child {
    border-bottom-left-radius: 
   20px; }
 * .tablepress tbody tr:last-child td:last-child {
    border-bottom-right-radius: 
   20px; }
 * .tablepress {
    border-collapse: separate; }
 * .tablepress tbody tr:first-child td {
    border-top: 1px solid #4A4A4C !important;}
 * .tablepress tbody tr:last-child td {
    border-bottom: 1px solid #4A4A4C; }
 * .tablepress tbody tr td:first-child {
    border-left: 1px solid #4A4A4C; }
 * .tablepress tbody tr td:last-child {
    border-right: 1px solid #4A4A4C; }
 * .tablepress tbody tr:first-child td:first-child {
    border-top-left-radius: 10px;}
 * .tablepress tbody tr:first-child td:last-child {
    border-top-right-radius: 10px;}
 * .tablepress tbody tr:last-child td:first-child {
    border-bottom-left-radius: 
   10px; }
 * .tablepress tbody tr:last-child td:last-child {
    border-bottom-right-radius: 
   10px; }
 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415281)
 * Hi,
 * what I mean is the concept of “Extra CSS classes” that I have explained above.
   I suggest that you use that to apply the consistent widths to all of those tables
   on that page.
 * Also, you seem to have the code for the round corners twice in your CSS, with
   different values.
 * Regards,
    Tobias
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415285)
 * Hello Tobias,
    excuse the late reply but I was just fine! I solved the code that
   appeared 2 times! But it is not very practical on the css not know where to start
   for the concept of Extra CSS classes! I’m sorry but if you can give me some advice,
   info I would be grateful!
 *  Thread Starter [bruno4italy](https://wordpress.org/support/users/bruno4italy/)
 * (@bruno4italy)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415287)
 * Hello Tobias, I solved simply by putting so
    .tablepress .column-1 { width: 350px;}
 * .tablepress .column-2 {
    width: 350px; } THNKS
 *  Plugin Author [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * (@tobiasbg)
 * [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415291)
 * Hi,
 * great! Remember that this will affect all tables on all pages that you have.
 * Best wishes,
    Tobias

Viewing 14 replies - 1 through 14 (of 14 total)

The topic ‘Border Radius Table’ 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/)

 * 14 replies
 * 2 participants
 * Last reply from: [Tobias Bäthge](https://wordpress.org/support/users/tobiasbg/)
 * Last activity: [11 years, 6 months ago](https://wordpress.org/support/topic/border-radius-table/#post-5415291)
 * Status: resolved