Не стилизуется focus на Input. Почему?

Question

[Alex Clean]

<p class="sign__form-time sign__form-item">
            <label for="sign__time sign__form-item">Время</label>
            <input id="sign__time" type="time" name="time" value="10:00">
          </p>

Допустим, есть такой вот кусочек кода. Хочу стилизовать Input, чтобы при кнопки Tab его border менял цвет.

.sign__form-item input:focus {
  border: 2px solid red;
}

Сделал так, а ему все равно, он не реагирует тупо. Все что происходит, это только слегка скругляются края при фокусе. Я думал, что где-то чет мешает, но нигде ничего не нашел, чистый Css.

Comments

[Антон Горецкий]

иногда браузер кэширует код и не хочет видеть изменения в коде - жмите ctrl-F5 чтобы принудительно перезагрузить

Answer 1

[Anonymous Penguin]

.sign__form-item input:focus {
  border: 2px solid red;
  outline: none; // Это тоже типа Border, только не влияет на геометрию. Поверх Border, вот и не видно
}

Comments

[Alex Clean]

Спасибо, помогло) Как раз пару сек назад об этом тоже подумал, попробовав в codepen изначально не стилизованный Input)