Удалить синюю рамку из открытого элемента <details> в Chrome?

Я обновляю свой сайт, чтобы использовать новый элемент HTML5 details для лучшей доступности.

Все работает нормально, но, к сожалению, когда я нажимаю, чтобы открыть элемент, Chrome применяет уродливую синюю рамку:

enter image description here

Есть ли способ остановить Chrome? Я не вижу каких-либо явных стилей CSS, поэтому я не уверен, как избавиться от него.

Код JSFiddle для демонстрации проблемы: http://jsfiddle.net/6x2Kc/

Ответы

Ответ 1

Используйте outline:none;

Для экземпляра

summary{
  outline:none;
}

РАБОЧИЙ ДЕМО

Надеюсь, что это поможет.

Ответ 2

Используйте схему: 0;

summary:focus {
     outline: 0;
}