Как удалить границу вокруг целенаправленной контентной рекламы?

Когда я устанавливаю элемент pre для contenteditable и ставил фокус в нем для редактирования, он получает пунктирную рамку вокруг него, которая выглядит не очень красиво. Границы нет, когда фокус находится где-то в другом месте.
Как удалить эту границу?

Спасибо

Ответ 1

Установите outline свойство на 0px solid transparent;. Возможно, вам придется установить его и в состоянии :focus, например:

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

Ответ 2

Вы также можете добавить :read-write псевдокласс в элементы стиля, которые можно редактировать.

Например (jsFiddle):

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

Подробнее здесь на дорожках.

Селектор псевдо-класса :read-write поддерживается в браузерах Chrome, Safari и Opera 14+, а также в iOS. Он поддерживается префиксом -moz- в Firefox в форме :-moz-read-write. Селектор :read-write не поддерживается в Internet Explorer и на Android.