Hello, I want to have different background colors on a sidebar and they’re all classed the same. How do you distinguish them in your CSS so that you can style them differently? The HTML looks like this. I’ve tried using adjacent siblings, but it doesn’t seem to create the look I’m looking for.
<div class="favs">
<h3>Books</h3>
<ul>
<li>Butterflies for Dummies</li>
<li>World of Butterflies</li>
<li>Are You a Butterfly?</li>
<li>Tale of Two Butterflies</li>
<li>Butterfly Erotica</li>
<li>The Happy Butterfly</li>
<li>No Bad Butterflies</li>
</ul>
</div>
<div class="favs">
<h3>Movies</h3>
<ul>
<li>Butterfly Love</li>
<li>Cocoon</li>
<li>Madame Butterfly</li>
<li>The Butterfly Effect</li>
<li>Butterflies Are Free</li>
<li>Why Butter Flies</li>
<li>Mothra</li>
</ul>
</div>
<div class="favs">
<h3>Sports</h3>
<ul>
<li>Butterfly Baseball</li>
<li>Swim the Butterfly</li>
<li>Skiing For Butterflies</li>
</ul>
</div>