Header color/fonts

Here’s the site I am trying to do this on: https://planet.vsphere-land.com/

I can get it to work if I do the following:

.wp-table-reloaded-id-1 .row-1 .column-1 {
background-color: #ffff77;
}
.wp-table-reloaded-id-1 .row-1 .column-2 {
background-color: #ffff77;
}

Can I apply a background color to a whole row rather than having a line for each column?

Hi,

the problem is a small conflict with your theme’s CSS. To fix it, you’ll need to give the table CSS a higher priority. This is done by adding the “!important” keyword.

This CSS will work:

.wp-table-reloaded-id-1 th, .wp-table-reloaded-id-1 .sorting {
background-color: #ff0000!important;
}

.wp-table-reloaded-id-1 .sorting_asc, .wp-table-reloaded-id-1 .sorting_desc {
background-color: #00ff00!important;
}

But your second solution would also work.
To style the whole row, use

.wp-table-reloaded-id-1 .row-1 td {
background-color: #ffff77;
}

(Could be that you’ll also have to add the “!important” there.)

Regards,
Tobias

that did the trick, thanks for the quick response!

for the 2nd solution though I had to do:

.wp-table-reloaded-id-1 .row-1 th {
background-color: #ffff77!important;
}

(th instead of td)

Is there a way to change the background on a whole column also? I tried this and it didn’t work:

.wp-table-reloaded-id-1 .column-1 td {
background-color: #ffff77!important;
}

Hi,

yes, of course th instead of td there (as it is the first row). If you remove the “.row-1” it will also work (that’s your first example then again), with the benefit that your table footer (if you have enabled it) would also be colored.

To change a complete column:

.wp-table-reloaded-id-1 .column-1 {
background-color: #ffff77!important;
}

No td is needed there, as the .column-1 is already the class of the the td.

Best wishes,
Tobias