web-dev-qa-db-fra.com

Comment supprimer la bordure autour d'un pré contenté modifiable?

Lorsque je mets un élément pré à contenteditable et que je le mets au point pour l'édition, il reçoit une bordure en pointillés autour de lui qui n'a pas l'air très agréable. La frontière n'est pas là quand le focus est ailleurs.
Comment supprimer cette bordure?

Merci

javascriptjquerycontenteditable
90
Christoffer

Définissez la propriété outline sur 0px solid transparent;. Vous devrez peut-être le définir sur le :focus indiquez également, par exemple:

[contenteditable]:focus {
    outline: 0px solid transparent;
}
170
Marius

Vous pouvez également ajouter le :read-write pseudo-classe pour styliser les éléments modifiables.

Par exemple ( jsFiddle ) :

.element:read-write:focus {
     outline: none;
}

En savoir plus ici sur codrops .

Le :read-write le sélecteur de pseudo-classe est pris en charge dans Chrome, Safari et Opera 14+, et sur iOS. Il est pris en charge avec le -moz- préfixe dans Firefox sous la forme :-moz-read-write. Le :read-write le sélecteur n'est pas pris en charge dans Internet Explorer et sur Android.

11
morkro