Nessun risultato. Prova con un altro termine.
Guide
Notizie
Software
Tutorial

CSS sulle horizontal rules

Tre soluzioni per modificare con i CSS l'aspetto di una horizontal rule.
Tre soluzioni per modificare con i CSS l'aspetto di una horizontal rule.
Link copiato negli appunti

àˆ possibile modificare con i CSS l'aspetto di una horizontal rule (<hr />)? Certo che è possibile ma i risultati relativemente al supporto cross-browser non sono garantiti.

Su questo nuovo blog, Bite Size Standards, Nathan Pitman propone questo approccio: inserire la hr in un div, impostare la sua proprietà  display su none e lavorare con gli stili sul div. Il codice potrebbe essere questo:


div.horRule {
height: 1px;
border-top: 1px solid #E5E5E5;
margin-top: 3px;
margin-bottom: 3px;
margin-left: 10px;
margin-right: 10px;
}

div.horRule hr {
display: none;
}

Prendo lo snippet di codice dal blog di Nathan Smith, che rispondendo a Pitman, propone questa soluzione che non fa uso di div aggiuntivi e che funziona bene sulle versioni più recenti dei principali browser:


hr
{
background: #ccc;
color: #ccc;
height: 1px;
margin: 0 0 10px;
}

Nei commenti al post di Smith, Dustin Diaz rimanda ad un terzo possibile approccio, quello proposto in questo esempio su Sitepoint.

Ti consigliamo anche