A
A
Alex Clean2022-03-31 16:34:54
Layout
Alex Clean, 2022-03-31 16:34:54

Focus is not styled on Input. Why?

<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>


Let's say there is such a piece of code. I want to style the Input so that when the Tab button is pressed, its border changes color.
.sign__form-item input:focus {
  border: 2px solid red;
}

He did so, but he does not care, he does not react stupidly. All that happens is that the edges are only slightly rounded when in focus. I thought that something was interfering somewhere, but I didn’t find anything anywhere, pure Css.

Answer the question

In order to leave comments, you need to log in

1 answer(s)
A
Anonymous Penguin, 2022-03-31
@WebNerd

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

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question