Recentemente mi sono trovato a ideare stili per i post "racconti brevi" sul mio sito personale, che ho deciso di ristrutturare, passando da WordPress a Octopress e GitHub—un post su quell'esperienza è in arrivo!

In ogni caso, i racconti brevi tendono ad essere lunghi (come i post del blog), quindi volevo fornire agli autori un modo semplice per includere pause di sezione enfatiche e semantiche. La modesta linea orizzontale <hr> sembrava la soluzione giusta, tanto più che Markdown li rende così facili da includere—basta aggiungere *** su una nuova riga.

La maggior parte dei browser rappresenta il tag <hr> come un bordo in rilievo—essenzialmente una linea scura impilata direttamente sopra una linea più chiara. Ma questo è eccitante quanto una delle lezioni di Ara di due ore sulla storia e sui vantaggi degli slip ventilati nell'Alaska rurale.

Quindi, ho cercato sul web soluzioni più accattivanti e mi sono imbattuto in un sito fin troppo familiare: CSS Tricks di Chris Coyier.

Un avvertimento: poiché questi stili si basano sui selettori di pseudo-elemento :after e :before, IE7 e versioni precedenti non li rendono molto bene. Pertanto, potresti dover trascorrere del tempo a trafficare con gli stili specifici per IE. Oppure potresti scegliere di fare qualcosa di più utile con il tuo tempo.