Хром не вступает в силу переопределения CSS

Question

Итак, я попытался манипулировать стилем в инспекторе Chrome и скопировать его непосредственно в мою таблицу стилей, но это не отражается, когда я снова запускаю его в Chrome. В противном случае код отлично работает на Firefox, а также если я вручную ввожу изменения в Chrome Inspector.

Не уверен, в чем проблема, так как я пытался добавить! Важное и убедиться, что иерархия имеет правильный порядок.

Код CSS

.select2-container--default .select2-selection--single {
    border: 1px solid #ced4da;
}
.is-invalid .select2-container--default .select2-selection--single {
    box-shadow: none;
    border: 1px solid #dc3545 !important;
}

HTML

<div class="form-group d-flex flex-wrap justify-content-between {{ $errors->first('contact_name', 'is-invalid')  }}">
    <label for="contact_name">Name</label>
    <span class="message">{{ $errors->first('contact_name', ':message') }}</span>
    <input type="text" class="form-control" id="contact_name" name="contact_name" placeholder="e.g. John Smith">
</div>

Я также очистил кеш и проверил, чтобы увидеть исходный файл, что все согласно обновлению. Это просто не отображается на результат только в Chrome

Answer 1

Вы также можете очистить кеш, используя инструменты отладки Chrome. Нажмите F12, затем выберите Application, затем выберите Clear Storage, убедитесь, что установлены флажки cache, затем нажмите кнопку clear site data.

Answer 2

Попробуйте выполнить полную перезагрузку, щелкнув правой кнопкой мыши кнопку перезагрузки.

Answer 3

Иногда требуется жесткая перезагрузка.

Удерживая нажатой клавишу Ctrl, нажмите кнопку «Перезагрузить». Или, удерживая Ctrl, нажмите F5.

Ctrl+F5