Effet de bordure ronde

Salut
je veux faire un effet de bordure ronde sur un champ de saisie(exemple boite de recherche), l'effet réussie très bien avec GOOGLE CHROME mes il ne marche pas avec "Mozilla Firefox 3.6.8" ni "IE 8.0".

#search-box
{
border-top-right-radius : 5px;
border-bottom-right-radius : 5px;
border-bottom-left-radius : 5px;
border-top-left-radius : 5px;
}

est ce que vous pouvez m'aidez avec ce problème ?
Modifié par yotta (24 Mar 2011 - 19:39)

Pour que cela fonctionne avec Mozilla il faut utiliser "-moz-border-radius", mais pour IE8 ne cherche pas ça ne fonctionne pas ... Pour arriver à faire des bordures arrondis sous IE il te faut passer par du javascript (jCorner par exemple).
Et pour être sur de prendre la plupart des navigateurs rajoute aussi le "-webkit-border-radius".

Au passage si tu met la même taille pour chacun de tes arrondis ne précise pas chaque taille utilise la propriété gobale

Du coup ça donne :

#search-box 
{ 
     border-radius : 5px; 
     -moz-border-radius:5px;
     -webkit-border-radius:5px;
}

Voilà, j'espère avoir répondu à ta question
cf : http://www.alsacreations.com/astuce/lire/979-ovale-forme-elliptique-css3-sans-image.html
Modifié par Matthieujo1 (24 Mar 2011 - 20:31)

ça marche bien avec Google Chrome toujours, mais avec Mozilla Firefox le champs est carré mais devient avec une bordure ronde quand la sourie est sur le champ.?