This content originally appeared on Stefan Judis Web Development and was authored by Stefan Judis
My friend Tom once more shared a very interesting link. The article by Roma Komarov describes that pseudo classes like :hover
and :active
of an input element will be also triggered when the associated label is e.g. hovered.
<label for="foo">Fooo</label>
<p>Some more content here</p>
<input id="foo">
#foo:hover {
background: yellow;
}
The above example will color the input field yellow whenever you hover over the label. #mindblown
Check out the examples in article yourself, that's crazy stuff!
Edited: Today I read that click handlers on an input field are also triggered when you click an associated label.
Reply to Stefan
This content originally appeared on Stefan Judis Web Development and was authored by Stefan Judis
Stefan Judis | Sciencx (2017-06-11T22:00:00+00:00) Labels trigger states for associated inputs (#tilPost). Retrieved from https://www.scien.cx/2017/06/11/labels-trigger-states-for-associated-inputs-tilpost/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.