5 ms·
With checkboxes, nesting the input inside the label makes the label clickable. It provides a larger target for checking, unchecking. Edit, to add: To avoid nes
by 8ig8 10y ago
With checkboxes, nesting the input inside the label makes the label clickable. It provides a larger target for checking, unchecking.
Edit, to add: To avoid nesting you can use the for attribute. More info on the following link addressing checkboxes and input nesting, in general:
http://stackoverflow.com/a/6293626 http://stackoverflow.com/a/6293626
- adregan 10y agoThe `for` attribute (`htmlFor` in jsx) will also allow the same kind of behavior: <label for="coolInput">Click me:</label> <input type="checkbox" id="coolInput" /> Edit: You edited while I was typing this out and added info about the `for` ;)
- cptskippy 10y agoThis certainly works but margins are still a dead-zone around inputs. Nesting the inputs can give you larger touch targets which is often preferable. http://codepen.io/anon/pen/qNzOYW http://codepen.io/anon/pen/qNzOYW