nth-child(even) always selecting dd, never dt (even and odd lines in dl)

Question

I'm trying to give a table appearance to a definition list and want to have the even lines colored differently from the odd ones with the help of some css3 selectors.

#specs dt:nth-child(even), #specs dd:nth-child(even) {
    background: blue;
}

This css code results in dt's without backgroundcolor and every dd being colored blue. The way I see it the render engine is actually counting siblings other than the ones selected too, resulting in every dt being odd and every dd being even.

Answer 1

If I understand correctly, you can do this using the nth-of-type selector:

#specs dt:nth-of-type(even), #specs dd:nth-of-type(even) {
    background: blue;
}

See: http://jsfiddle.net/5Zjqh/