Abel Poucet Webdesign
Accueil du site > tools > Styler la balise HR
Styler la balise HR

Styler la balise HR

Une solution simple et cross-browser pour styler ses balises hr en CSS.


En effet, chaque navigateur gère différemment la balise hr, quand Gecko (moteur de rendu) interprétera une ligne de 1px de haut et une bordure de 1px, de son côté, WebKit affichera une bordure de 2px et IE une ligne de 1px de haut.


La solution suivante affichera une ligne de 1px grise dans tous les navigateurs.

hr {
color: gray;
background-color: gray;
height: 1px;
border: 0;
margin: 10px 0;
}

Une solution pour afficher une image en lieu et place du hr :

div.hr {
 height: 15px;
 background: #fff url(hr1.gif) no-repeat scroll center;
}
div.hr hr {
 display: none;
}

Pour en savoir plus :
lien : http://www.sovavsiti.cz/css/hr.html
lien : http://www.nanoum.net/blog/4_appare...

Vos réactions

Aucune réaction pour l'instant. Utilisez le formulaire ci-dessous pour réagir à l'article.

Réagir

(Vous pouvez laisser un message en remplissant les champs ci-dessous)


Votre réaction :

Navigation alternative :

Contact

  • 14 bis, bd de l'Hôpital 75005 Paris
  • 06 81 35 98 00

Navigation / syndication

logo abel                        © Abel Poucet Webdesign - Motorisé par SPIP - Webdesign : Abel Poucet