I want to target the ordered list using a child selector ie ol>li {color:red;}. What am I doing wrong? It targets all li elements.
<div>
<ul>
<li>unordered list 1</li>
<li>unordered list 2
<ol>
<li>ordered list</li>
<li>ordered list 2</li>
<li>ordered list 3</li>
</ol>
</li>
</ul>
</div>
I thought maybe there was a minor mistake I was missing, since it seems like everything should work fine. However, I tried it in CodePen just to be sure, and it worked fine. Check your HTML/CSS files for typos.
Yes, that should work, unless some other style is overriding it. You could try ul ol > li
I have moved the code to a new page and validated it.
ol>li works but ul>li does not - all li elements are coloured.
We need to see your full code to know what’s happening here. Make sure to clarify what yu want to see happening.