I was working on a project at home today and wanted to set the first letter of the FAQ paragraphs (The “Q” and the “A”) be larger than the rest of the letters. I knew I use CSS to do this quickly and easily, but had forgotten how. It may be a surprise to some of those I’ve taught, but I am not, in fact, able to remember every single tag in every single language there ever was or is currently, pretty close to all of them, but not quite 100%.

I realized tat my CSS reference book was out on loan. Hmmm, I tried looking it up in Dreamweavers reference section, but it wasn’t there. So I turned to the to internet. I was shocked at how complicated some people think this is. Some people use a span tag and then pseudo classes of the span tag. Some people were even using JavaScript! This is how is done, the quick and easy and proper way:
.YourClassNameHere p {font-size: 12pt}
p:first-letter {color:#ff0000;font-size:xx-large}

The first words of an article...


Feel free to substitute “xx-large” with whatever value is appropriate.
This will . . . well I hope at this point it’s obvious what this code will do.

Leave a Reply

CommentLuv Enabled