Jak usunąć obramowanie wokół skoncentrowanego contenteditable?

Question

Po ustawieniu elementu wstępnego na contenteditable i skupieniu się na nim do edycji, otrzymuje on wokół niego przerywaną ramkę, która nie wygląda zbyt ładnie. Granicy nie ma tam, gdzie ostrość jest gdzie indziej.
Jak usunąć tę ramkę?

Dzięki

Answer 1

Ustaw outline property do 0px solid transparent;. Może trzeba ustawić go na stanie :focus jak również, na przykład:

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

Answer 2

Można również dodać :read-write pseudo-klasę elementów wystroju, które można edytować.

Na przykład (jsFiddle):

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

Czytaj więcej here on codrops.

Selektor pseudoklasy :read-write jest obsługiwany w Chrome, Safari i Opera 14+ oraz na iOS. Jest obsługiwany z prefiksem -moz- w przeglądarce Firefox w postaci :-moz-read-write. Selektor :read-write nie jest obsługiwany w przeglądarce Internet Explorer i systemie Android.