Article(s) taggés avec ‘round’

Arrondir les coins en CSS

jeudi 6 janvier 2011

Arrondir les coins d’un div ou d’une image est un petit plus dans la création d’un site web pour casser la monotonie rectangulaire.
Malheureusement, il n’existe pas de style CSS unique permettant d’obtenir cela sur tous les navigateurs. Cependant, comme il s’agit d’un petit plus non obstrusif, l’on peut spécifier dans une classe CSS tous les propriétés permettant de couvrir un maximum de navigateur.

-moz-border-radius: 0px 5px 10px 15px;
-webkit-border-radius: 0px 5px 10px 15px;
-khtml-border-radius: 0px 5px 10px 15px;
border-radius: 0px 5px 10px 15px;

Evidemment, mon exemple propose un arrondi différent pour chacun des coins mais de manière générale, on se satisfera d’un arrondi commun à tous les angles que l’on obtiendra simplement un indiquant un valeur unique.