How can I style li tags using nth-child when these li tags are nested within a tag like this:
<ul>
<a href=""><li>this is a test</li></a>
<a href=""><li>this is a test</li></a>
<a href=""><li>this is a test</li></a>
<a href=""><li>this is a test</li></a>
</ul>
I have tried styling them like this:
a:nth-child(even){
background-color: #f5f5f5;
border-right: 2px solid #666;
}
.li:hover{
background-color: #555;
color: #fff;
}
However, it doesn't seem to work. I believe the li tag should be a direct child of the ul tag for it to work properly.