How to use nth-of-type to select nested children

Question

I am trying to style odd and even headers that are associated with content. They are inside several DIVs, and I am unable to get nth-child or nth-of-type to work- only the

Answer 1

Try this

.content div.post:nth-of-type(odd) a{color: #444;}
.content div.post:nth-of-type(even) a{color: #ccc;}

The a element of odd and even divs with post class. Not quite sure if that's what you need. A working example: http://jsfiddle.net/a4j7z/

Answer 2

Use nth-child on the .post elements, and then select the h2 element from there

jsFiddle example

.post:nth-child(odd) h2 a {
    color: red;
}
.post:nth-child(even) h2 a {
    color: green;
}