WordPress.org

Forums

[Plugin: TablePress] Custom CSS not working properly (17 posts)

  1. desGNARlais
    Member
    Posted 2 years ago #

    Here's a link to the page.
    http://shredoregon.org/longboarding/shred-oregon-race-series/

    I'm having difficulties trying to get the custom CSS to work.

    The odd/even colors aren't showing and the highlighting is only happening on the odd rows. Some help would be greatly appreciated.

    Here's my code...

    .tablepress .odd td {
    	background-color: #C9C9C9;
    }
    .tablepress .even td {
    	background-color: #F3F4F5;
    }
    .tablepress .row-hover tr:hover td {
    	background-color: #3CFF00;
    }
    .tablepress {
    	width: 685px;
    }
    .tablepress .column-1 {
    	width: 240px;
    }
    .tablepress .column-2 {
    	width: 110px;
    }
    .tablepress .column-3 {
    	width: 240px;
    }
    .tablepress .column-4 {
    	width: 200px;
    }

    Thanks!

  2. TobiasBg
    Member
    Posted 2 years ago #

    Hi,

    thanks for your post, and sorry for the trouble.

    The reason for this is that your theme also contains CSS code that influences tables, and that CSS is added with a rather high priority. Therefore, you'll just need to raise the priority of your "Custom CSS" a little bit, by extending the selector with #content.
    Please change your "Custom CSS" to

    #content .tablepress .odd td {
    	background-color: #C9C9C9;
    }
    
    #content .tablepress .even td {
    	background-color: #F3F4F5;
    }
    
    #content .tablepress .row-hover tr:hover td {
    	background-color: #3CFF00;
    }
    
    #content .tablepress th,
    #content .tablepress td {
    	padding: 8px;
    }
    #content .dataTables_wrapper .sorting,
    #content .dataTables_wrapper .sorting_asc,
    #content .dataTables_wrapper .sorting_desc {
        padding-right: 20px;
    }

    (The CSS for the widths, that I removed is not necessary in its current form.)

    Regards,
    Tobias

  3. Bon38
    Member
    Posted 2 years ago #

    Hi Tobias,

    I have recently begun working on a PW site that uses your wonderful TablePress plugin, my only concern was when I tried customizing the Table. I actually tried to apply the solution you mentioned above but still no luck.

    I simply tried using this short custom css I made to begin with:

    #content .tablepress th {
    background-color: #66CCFF;
    color: #387d3d;
    }

    But as I said, it did not work unfortunately. Your immediate assistance would be greatly appreciated for I am currently rushing to finish this WP website project of mine.

    Thanks for your time.

  4. TobiasBg
    Member
    Posted 2 years ago #

    Hi,

    thanks for your post, and sorry for the trouble.

    To find out what's wrong, I need to take a look at your site. Therefore, please post a link to the page with the table. Thanks!

    Regards,
    Tobias

  5. Bon38
    Member
    Posted 2 years ago #

    Hello again and thanks for replying to my query... the site is http://www.pagargolf.org, just click on the LEADRBOARD nav link on the main nav bar.

    Added note: I applied these using the Custom CSS form on the WP/TablePress Admin page.

    Thanks again for your help.

  6. Andrew
    Forum moderator
    Posted 2 years ago #

    @Bon38, please ensure your website is available to view.

  7. TobiasBg
    Member
    Posted 2 years ago #

    Hi,

    yes, it's not working for me either :-( I get a "330 Unknown Error".

    Regards,
    Tobias

  8. Bon38
    Member
    Posted 2 years ago #

    Hi Tobias

    Ok so you were able to access the website http://www.pagargolf.org? It wont work from your end as well?

  9. TobiasBg
    Member
    Posted 2 years ago #

    Hi,

    I'm not able to access http://www.pagargolf.org at all. I only get a an error:

    Content Encoding Error
    The page you are trying to view cannot be shown because it uses an invalid or unsupported form of compression.

    (in different and up-to-date webbrowsers). There's some server issue going on, I assume.

    Regards,
    Tobias

  10. Bon38
    Member
    Posted 2 years ago #

    hello Tobias,

    That is indeed unusual for we were able to access it yesterday and just early this morning. Will check it out later tonight and talk to our Hosting Provider. This is definitely bad news.

    Will contact you again soon. Thanks again for your help.

  11. TobiasBg
    Member
    Posted 2 years ago #

    Hi,

    yes, probably a temporary server glitch. Your hosting provider should be able to help.
    Just post here again, once you've sorted this out.

    Regards,
    Tobias

  12. scott miller
    Member
    Posted 1 year ago #

    Just wanted to say that after reading approximately 7000 posts on the tablepress custom table width not being respected, I found here that adding "#content" to raise the custom css finally fixed it. Tobias, your answers everywhere I look are immensely helpful, thank you.

  13. TobiasBg
    Member
    Posted 1 year ago #

    Hi Scott,

    thanks for your post. Sorry to hear that you had those CSS troubles...

    Yes, unfortunately, some themes have their own CSS for tables, and then are pretty drastic about setting it, for example with that extra #content CSS ID in the code :-( Unfortunately, that's not the same code for every theme, which makes it so difficult to find a solution that works everywhere. So, it's really great to hear that you found the solution for your theme! :-)

    Best wishes,
    Tobias

  14. mnwaterbug
    Member
    Posted 1 year ago #

    I want a smaller table row height here, and I've added this to my Custom CSS file:

    #content .tablepress th,
    #content .tablepress td {
    	padding: 0px;
    }

    But it looks the same whether padding is 0px, 10px or 100px. I can't change the color of the table with the Custom CSS file either. I've looked for a few hours, and I'm running out of ideas! Any help would be appreciated.

  15. TobiasBg
    Member
    Posted 1 year ago #

    Hi,

    thanks for your post. That table (with all the form elements) was not created with TablePress, and therefore, the "Custom CSS" does not work.
    However, some slightly more general "Custom CSS" will affect this table (and all other tables on the site that were not created with TablePress):

    table th,
    table td {
    	padding: 0px;
    }

    Regards,
    Tobias

  16. mnwaterbug
    Member
    Posted 1 year ago #

    Thanks, that did it ...and sorry for the bum steer. I'm in the middle of a conversion from MS Expression Web... I lost track of what tables I copied vs. created with Tablepress. Thanks to plugins like yours, I think I'm going to like WP a lot more than EW!

    I like your tag-line... code IS poetry!

  17. TobiasBg
    Member
    Posted 1 year ago #

    Hi,

    great to hear that this helped! :-) Yes, I can see that you'll have more fun after switching from EW to WordPress. Good decision! :-)

    Oh, and that tag-line isn't mine, but WordPress's actually :-)

    Best wishes,
    Tobias

    P.S.: In case you haven't, please rate TablePress here in the plugin directory. Thanks!

Topic Closed

This topic has been closed to new replies.

About this Topic