Posted By

michellebracken on 08/18/11


Tagged


Versions (?)

CSS Drop Caps


 / Published in: CSS
 

Drop Caps can easily be styled by taking advantage of the CSS pseudo-element :first-letter. This should work in all modern browsers. CSS3 introduces the ::first-letter notation to distinguish between pseudo-elements and pseudo-classes, but this new notation is not yet compatible with IE. For now use the single :first-letter notation.

  1. 1 p:first-letter {
  2. 2 display: block;
  3. 3 float: left;
  4. 4 margin: 5px 5px 0 0;
  5. 5 color: red
  6. 6 font-size: 1.4em;
  7. 7 background: #ddd;
  8. 8 font-family: Helvetica;
  9. 9 }

Report this snippet  

You need to login to post a comment.