Submit a CSS related link →

Posh CSS

For the modern day web designer.

How to create drop caps with CSS (and CSS3)

# Linked to 1 March 2010, 09:31 in by Sam Brown

Drop caps are a nice typographic detail that look great on many websites and the :first-letter pseudo-element is a great way of creating these. In this post, I explain some basic styles using :first-letter for drop caps and I show some drop cap examples. Where it gets more interesting is the use of CSS3 properties like border-radius, box-shadow and gradients in combination with :first-letter to create some attractive drop caps without the use of images.

Read more at www.cvwdesign.com →

Sam Brown

Sam Brown is a freelance interface designer and web standards developer based in Edinburgh, Scotland. Sam's work can be seen at Massive Blue, blogs at Sam Brown and is on Twitter at @sambrown.