CSS nth-child selector do not work in Outlook/Gmail

0
votes

I'm sending mails when performing some actions, and some of them contain an HTML table. I wanted to color 1 line out of 2 in the table and for that I'm using the rule below :

tr:nth-child(even) {
  background-color: #c4409720;
}

In mailhog the output is perfect and it works but once looking at the email in Outlook or Gmail the rows are not coloured. Note that I don't know how many rows I'll have in advance since the mail template is populated with a list and a loop.

I guess the selector is not supported in those mail clients ?

So how could I achieve this in a way that will be understood by those mail clients ?

Thanks in advance !

cssoutlookcss-selectorsgmailhtml-email
Does this answer your question? web email zebra striped table impossible on Gmail, Hotmail, Outlook? – David
Outlook uses Word for rendering message bodies. See Word HTML and CSS Rendering Capabilities in Outlook for more information. – Eugene Astafiev
@David Not really since I can't use inline style. Remember, my rows are populated with a loop so I can't add a class on 1 out of 2 rows manually. That's why I tried to use a selector. – lbris
See :nth-child support in email clients: caniemail.com/features/css-pseudo-class-nth-child – HTeuMeuLeu