Hi,

I need to format HTML similar to below. Basically a quote is optional, and I need to dropcap the first letter of the body paragraph.

<article>
 <p class="quote"> <!-- quote is optional -->
   Genius begins great works; labor alone finishes them.-- Joseph Joubert
 </p>
 <p> <!-- "L" is a dropcap -->
  Life is like a box of chocolates.
 </p>
 <p>...</p>
 <p>...</p>
</article> 

My CSS looks like this:

article > p:first-child:first-letter
{
 float: left;
 font-family: Georgia, serif;
 font-size: 360%;
 line-height: 0.85em;
 margin-right: 0.05em;
}
p.quote {
 font-weight: bold;
}

It doesn't work currently when the quote is introduced. AFAIK I can't select the article's first child P which is not class "quote." I'll use jQuery if I can't figure this out, but for now I'm looking for a way to do it CSS only.

Thanks in advance!