Make the first letter of the paragraph larger

I am working on my HTML assignment. This is basic CSS material (external style sheet), and I'm almost done. Everything works as it should, except for one part that I canโ€™t understand why.

</header>

     <article>
        <h2>About the Course</h2>
        <p>
           The Civil War and Reconstruction
           explores the causes and consequences of the American 
           Civil War, covering American history from 1840 through 1876 in
           great detail. My primary goal is to interpret the multiple 
           threads that run through this epic event and consider how these
           threads still engage the politics and culture of the 
           present day. In this course we will rely heavily on primary
           texts, interpreting the events of the day through the words of
           those men and women who experienced it. We'll examine four main
           points of interest:
        </p>
        <ul>

Thus, of the 21 requirements for this assignment # 15:

In the first paragraph after the h2 heading in the article element, create a style rule to display the first letter with a font size of 32 pixels.

So, I did it like this:

article h2 p:first-of-type:first-letter {
font-size: 32px;
}

This did not work, so I changed it to:

article > h2 p:first-of-type:first-letter {
 font-size: 32px;
}

and yet it wonโ€™t work!

+3
source share
2 answers

This paragraph is not a descendant <h2>, but after it. Change your CSS to this:

article h2 + p:first-letter {
    font-size: 32px;
}

+ ( ) p h2. StackOverflow, .

, - :first-of-type, + .

+10
article h2 + p:first-letter {
    font-size: 32px;
}
+3

All Articles