Angular не может удалить контур фокуса из пользовательского флажка Boostrap

0

По какой-то нечетной причине Angular не размывает элемент с щелчком, поэтому я "исправил" его так:

*:focus { outline: none !important; }

Это не реальное исправление, вместо этого каждый элемент должен быть размытым автоматически, но я не уверен, как это сделать без директивы, поэтому это нужно делать пока, если у кого-то нет лучшего решения.

Однако я не могу применить одно и то же "исправление" для пользовательских флажков Bootstrap.

<label class="c-input c-checkbox">
    <input type="checkbox">
    <span class="c-indicator"></span>
    Remember Me
</label>

Вот как это выглядит, когда сосредоточено:

Изображение 174551 Изображение 174551

Я попытался удалить контур, границу, коробку-тень - ничего не работало.

  • 0
    .c-checkbox input:focus {outline: none !important} не работает? Попробуйте воспроизвести проблему в jsfiddle, чтобы мы могли видеть, что происходит
  • 0
    Я просто пробовал это с помощью фрагмента StackOverflow, как ни странно, этого не происходит. Я использую Bootstrap v4 Alpha и AngularJS Stable v1.4.8. Я уверен, что это не имеет ничего общего с моими пользовательскими правилами CSS. И нет, это не исправит ..
Показать ещё 7 комментариев

1 ответ

0
Лучший ответ

Это не проблема, возникающая из ваших библиотек, а ваш пользовательский css. Вы должны что-то упускать, но этот код должен работать. Поместите его в конец вашего пользовательского файла css.

.c-input .c-indicator {
    border: none !important;
    outline: none !important
}
  • 0
    Нет, все еще ничего .. Я загрузил все свои css на pastebin и связал их в комментарии к вопросу, если вы могли бы взглянуть, пожалуйста.
  • 0
    box-shadow: none !important; казалось, это исправить, но не *:focus , странно ..

Ещё вопросы

Сообщество Overcoder
Наверх
Меню