Come faccio a rimuovere il bordo intorno una mirata pre contenteditable?

Question

Quando ho creato un elemento pre per contentEditable e mettere a fuoco per la modifica, riceve un bordo punteggiato intorno ad esso che non sembra molto bello. Il confine non è lì quando attenzione è da qualche altra parte.
Come faccio a rimuovere quel confine?

Grazie

Answer 1

immobili outline per 0px solid transparent;. Potrebbe essere necessario impostarla sullo stato :focus così, ad esempio:

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

Answer 2

È inoltre possibile aggiungere il :read-write pseudo-classe di elementi di stile che sono modificabili.

Per esempio ( jsFiddle ) :

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

Per saperne di più qui codrops .

  

Il selettore pseudo-classe :read-write è supportato in Chrome, Safari e Opera 14+, e su iOS.   E 'supportato con il prefisso -moz- in Firefox in forma :-moz-read-write.   Il selettore :read-write non è supportata in Internet Explorer e su Android.