Blog de Jordi Mir :

Le site WebDesignerWall nous montre comment faire en CSS3 un joli formulaire de recherche. Lorsque le navigateur ne supporte pas CSS3 on a un formulaire classique rectangulaire

Tout d’abord pour faire un cercle en CSS3 :

.circle {
width: 100px;
height: 100px;
-moz-border-radius: 100px;
-webkit-border-radius: 100px;
}

Et pour un ombrage dans la boite recherche supporté uniquement sur Chrome 4+ et Firefox 3.5+ :

.inset {
   -moz-box-shadow: inset 0 3px 8px rgba(0,0,0,.4);
   -webkit-box-shadow: inset 0 3px 8px rgba(0,0,0,.4);
   box-shadow: inset 0 3px 8px rgba(0,0,0,.24);
}

Ce qui donne :