Entropia
Entropia

Reputation: 23

CSS Even&odd affect the thead

I use even & odd CSS rule for a table but that's also the changing <thead>.

thead {background-color: #999;}
tr:nth-child(even) {background: #fff}
tr:nth-child(odd) {background: #C8C8C8}

The result is that my <thead> is #C8C8C8 and not #999.

So my question is, is that possible to use even & odd without that's affect the <thead>?

Upvotes: 2

Views: 688

Answers (2)

Juan G. Hurtado
Juan G. Hurtado

Reputation: 2137

Sure, use tbody selector:

thead{background-color: #999;}
tbody tr:nth-child(even) {background: #fff}
tbody tr:nth-child(odd) {background: #C8C8C8}

Because you are using <tbody> elements on your <table>, right? If don't, you should use it :)

Upvotes: 0

Christofer Eliasson
Christofer Eliasson

Reputation: 33865

You can add tbody to you selector so that the rule only applies to tr:s within your tbody:

tbody tr:nth-child(even) {background: #fff}
tbody tr:nth-child(odd) {background: #C8C8C8}

Upvotes: 3

Related Questions