Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS adjacent siblings

  • This topic is empty.
Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #28170
    leeguns
    Member

    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>

    #71730
    leeguns
    Member

    If I could do that then I wouldn’t have posted on here. However, I can’t change any of the html. I’ve thought about using the nth child on this one, but how do I ensure that the h3 is styled the same background color as its corresponding list. Help

Viewing 2 posts - 1 through 2 (of 2 total)
  • The forum ‘CSS’ is closed to new topics and replies.