19. Intestazioni e paragrafi

Formattiamo quindi le intestazioni e i paragrafi all'interno dei contenuti:

  1. #content h2 {
  2. margin: 0;
  3. padding: 0;
  4. font: 1.6em/normal "Arial Narrow", Arial, sans-serif;
  5. color: #800;
  6. background: transparent url("img/plugin.gif") no-repeat 0 50%;
  7. text-indent: 1em;
  8. border-bottom: 1px dashed #999;
  9. }
  10. #content p {
  11. margin: 0;
  12. padding: 0.5em 0;
  13. }

Il titolo dell'articolo ha un font Arial Narrow di colore rosso scuro con una dimensione pari ad 1.6em. La sua interlinea è stata normalizzata in modo da evitare che ci crei spazio tra il testo ed il bordo sottostante. L'elemento ha un'immagine di sfondo posta alla sua sinistra e centrata in verticale (coordinate 0 50%). L'indentazione serve a creare dello spazio tra l'immagine ed il testo del titolo. I paragrafi usano il solo padding verticale, al fine di evitare alcuni problemi inerenti al computo dei margini verticali collassati.

Possiamo osservare i nostri progressi nel nostro documento XHTML e nel nostro documento HTML.