The importance of clear namespaced HTML attributes
Here's another reminder why expressive, namespaced ids are important.
This time is about a label's [```for```](https://www.w3schools.com/tags/att_label_for.asp) attribute.
```
<input id="phone">
<label for="phone"></label
```
This would work just as expected unless, for example, we have a svg sprite at the beginning of the document that includes an svg with a "phone" ```id```.
```
<symbol id="phone" viewBox="0 0 61.4 48">...</symbol>
...
<input id="phone">
<label for="phone"></label
```
In this case, the label's ```for``` will match the first in a top-down order that has the target id.
And you will never know why clicking the label won't trigger the input.
Nick Ciolpan
05 Apr 2020
« Back to post