Alternating rows color option is reversed

Hi Drew,

thanks for your post. Great to hear that you like TablePress!

I’m not really sure that I understand the problem. Can you clarify what you feel is incorrect?
The wording of the “Alternating Row Colors” option is “The background colors of consecutive rows shall alternate.”, which means that TablePress will add that effect to a table if the checkbox is checked.
Is that not happening for you? Can you then maybe post a link to a page with the table?

Thanks!
Tobias

When the option is unchecked, the rows alternate colors.

When the option is checked, the rows don’t alternate colors.

The option text “The background colors of consecutive rows shall alternate.” implies that when the option is checked the row colors will alternate. It’s currently reversed.

Hi Drew,

thanks for the explanation.
I can’t reproduce this though, (and I have not had a report on this before).

Can you verify this with TwentyTwelve?

My assumption is that your theme also contains code to add such an effect. This would explain why you have alternating row colors when the checkbox is unchecked. When you now check the checkbox, my assumption is that parts of the CSS now cancel out so that you don’t see the effect. If you post a link to the page with the table, I’ll gladly check this!

Regards,
Tobias

Yep, looks like it’s the client’s theme.

Strangely, this is what it looks like when the option is unchecked: https://cl.ly/image/2r2v3Q0H1i22

Weird, right?

Hi,

thanks for the image.
I think that confirms my assumption: Your theme contains its own CSS to add an alternating row colors effect to tables (via a :nth-child CSS selector). That’s the reason for the alternating row colors with the bigger difference in the screenshot.

I suggest to remove that effect from the theme CSS (if you are using a child theme), or by overwritting the theme CSS with some “Custom CSS” in TablePress.

If you investigate the table cells in Firebug or the Chrome Dev Tools, you can find the selector that the theme CSS uses, and reverse that via own CSS. If you post a link, I’ll gladly find that CSS for you.

Regards,
Tobias

Yep. Looks like some declaration the client added recently. Sorry for the confusion.

Hi,

sure, no problem!

I think, that it might be a good idea to add some “reset CSS” for the most common cases of such theme CSS to TablePress, to make sure that that alternating row colors are off, if the checkbox is unchecked…

Best wishes,
Tobias

Hi again Tobias,

I have unchecked the following box: “The background colors of consecutive rows shall alternate” but I am still seeing alternating colors. If it is the WP theme (Pinboard) doing this, what code would overwrite this in TablePress custom CSS?

Here is the page with table: https://edesiaindustries.com/beta/our-products/

Thanks!!!

Hi,

this is indeed being done by your theme. To change this, please add this to the “Custom CSS” textarea:

table tr:nth-child(even) {
  background-color: transparent;
}

Also, there is something wrong with the CSS that you added to remove the borders. Please try replacing that with the CSS from https://tablepress.org/faq/remove-borders-from-a-table/

Regards,
Tobias

That worked great! Thank you for the fast reply. Is there anything I can do about removing the borders that appear around the image when the mouse is hovering? Thanks again.

Hi,

good to hear that this worked! To remove that background, try adding

.tablepress a img {
    box-shadow: none;
    background: transparent !important;
}

Regards,
Tobias

Perfect! That worked great. Thanks again for being so responsive.

Hi,

no problem! You are very welcome!

Best wishes,
Tobias