Question

So this is the current code structure:

<section>
    <article>
        <p>Title</p>
        <p>Content</p>
    </article>

    <article>
        <p>Title</p>
        <p>Content</p>
    </article>

    <article>
        <p>Title</p>
        <p>Content</p>
    </article>
</section>

How do I get the first and the third title to float:left, and the second title to float:right…?

I tried this:

section article p:first-child:nth-child(even){
    float:right;
}

But I got no luck… 🙁

Answer 1

section article p:first-child {
    float: right;
}
section article:nth-child(even) p:first-child {
    float: left;
}