WordPress.org

Ready to get started?Download WordPress

Forums

TablePress
[resolved] Highlighting whole columns (13 posts)

  1. Rican UK
    Member
    Posted 7 months ago #

    Hi,

    I'm having problems applying a colour to a whole column. Below is the code I inserted into the CSS section.

    .tablepress-id-1 .column-2 {
    	background-color: #ff0000;
    }

    Occasionally, it will just highlight the cell in the first row, but mostly, it doesn't make any difference at all.

    Please can someone advise what CSS I need to add to change the background colour of a whole column.

    Many thanks!

    DS

    http://wordpress.org/plugins/tablepress/

  2. TobiasBg
    Member
    Plugin Author

    Posted 7 months ago #

    Hi,

    thanks for your question, and sorry for the trouble.

    As the coloring for alternating row colors works with similar code, you'll have to raise the priority of this change. Please try again with

    .tablepress-id-1 .column-2 {
    	background-color: #ff0000 !important;
    }

    Regards,
    Tobias

  3. Rican UK
    Member
    Posted 7 months ago #

    Thanks for your reply Tobias.

    Its working great now.

    DS

  4. Rican UK
    Member
    Posted 7 months ago #

    Hello again,

    I've just been thinking, is it possible to change the colour of the column, but also have the hover-over work?

    At the moment, after I've changed the colour, the hover-over doesn't seem work.

    Look forward to hearing from you.

    DS

  5. TobiasBg
    Member
    Plugin Author

    Posted 7 months ago #

    Hi,

    good to hear that this already helped!
    To fix the hover effect, please extend the code to this:

    .tablepress-id-1 .column-2 {
    	background-color: #ff0000 !important;
    }
    .tablepress-id-1 .row-hover tr:hover td {
            background-color: #f3f3f3 !important;
    }

    Regards,
    Tobias

  6. Rican UK
    Member
    Posted 7 months ago #

    Thanks. Thats great!

    One last thing: is it possible to put a border line between columns like there is between rows?

    If so, is it also possible to only have those lines between columns 1 & 2 and 3 & 4?

    Trust this makes sense.

    MT
    Dale

  7. TobiasBg
    Member
    Plugin Author

    Posted 7 months ago #

    Hi,

    yes, that's also possible with some CSS code:

    .tablepress-id-1 .column-2,
    .tablepress-id-1 .column-4 {
      border-left: 1px solid #dddddd;
    }

    Regards,
    Tobias

  8. Rican UK
    Member
    Posted 7 months ago #

    Thats brilliant Tobias. Works a treat!

    Many thanks!

  9. TobiasBg
    Member
    Plugin Author

    Posted 7 months ago #

    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 here in the plugin directory. Thanks!

  10. Tim0000
    Member
    Posted 6 months ago #

    Many thanks for the tip with column highlighting.
    How is the code, when I want to highlight the complete column except the first row?

    Thank you.

  11. TobiasBg
    Member
    Plugin Author

    Posted 6 months ago #

    Hi,

    thanks for your question!

    With "first row", do you mean the header row? Then the code would be

    .tablepress-id-1 tbody .column-2 {
    	background-color: #ff0000;
    }

    (where the tbody defines that this shall only apply to the data rows).

    Regards,
    Tobias

  12. Tim0000
    Member
    Posted 6 months ago #

    Absolutely perfect!
    Thank you very much. Will donate tomorrow.

  13. TobiasBg
    Member
    Plugin Author

    Posted 6 months ago #

    Hi,

    no problem, you are very welcome! :-) Good to hear that this helped!
    And thanks for wanting to donate, I really appreciate it!

    Best wishes,
    Tobias

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

Reply

You must log in to post.

About this Plugin

About this Topic