Bonjour à tous,

j ai un soucis avec mon input et le css.

Voilà le html du input

 <input type="text" name="mail" class="Mail" placeholder="Email" autocomplete="off">

et voila le css

j'ai le css par défaut et le css qd le input est selectionné

.Mail{
 position:relative;
 top:50px;
 margin-left:30px;
 width:320px;
 height: 44px;
 padding: 0 10px;
 border: 1px solid #c3c3c3;
 border-radius: 4px;
    }	

.Mail:focus {
 border-color: #0087be;
}

Quand je sélectionne le champ la bordure bleue se met bien mais en y regardant de plus pret y a une bordure bleue derriere qui me donne un angle droit.

Je voudrais que l'arrondi soit parfait.

Voici le détail agrandi.

Merci pour votre aide.

Klorane

Bonjour,

il s'agit d'un outline ajouté par Chrome essentiellement. Tu peux le mettre à 0.

Salut,

Sur chrome, je présume ? C'est un de ses comportements par défaut.

Ajoute un  outline: 0; sur ton champ au focus.

Edit: grillé.

-
Edité par EmmanuelBeziat 11 décembre 2017 à 15:39:16

Super !! Merci à vous 2 pour la solution car je ne savais plus ou chercher

En effet sur chrome

encore merci

Klorane