4 ms·

The mentioned "Checkbox/Label Trick" seems to be getting somewhat popular, but that's quite a hack and abuse of HTML semantics. Hacks like that (and this one in

The mentioned "Checkbox/Label Trick" seems to be getting somewhat popular, but that's quite a hack and abuse of HTML semantics. Hacks like that (and this one in particular) lead to issues for browsers with CSS unused/disabled/altered, quite similarly to reliance on JS.

lytedev 8y ago
Would it be more fair to say it's an abuse of CSS? FWIW, I think it's a brilliant and simple solution, though the general sibling combinator sometimes feels like cheating in the best way possible.
- defanor 8y ago
  > Would it be more fair to say it's an abuse of CSS? In the sense of "improper usage", it applies to the resulting HTML with any CSS or without it at all; CSS is merely used here to make it look fine in some cases. Hacks can be clever and amusing (I was amused by this one too), but usually get rather annoying as they get used widely and break things.
untog 8y ago
I'm also very dubious about the accessibility implications. Hidden checkboxes and labels covering the entire screen don't feel great, though it's not my area of expertise.
freshm087 8y ago
Disabled CSS would leave such form still usable. It wouldn't look, and behave exactly as intended, for sure, but I suppose these days no one expects unchanged user experience while disabling CSS. Meanwhile, disabled JS on JS-based forms usually kills them.
- defanor 8y ago
  HTML/CSS as in the example would indeed be usable, though a similar version of this (with inline labels and checkboxes used for "aside" notes) gets rather messy when used in a textual browser or converted into another format. JS-based expansion doesn't have to get unusable either (it can merely hide bits of a document after loading, with those present in HTML), but perhaps could become unusable more easily. I'm not arguing for use of JS, by the way (not sure if it was clear), but rather for proper use of HTML.

lytedev 8y ago

Would it be more fair to say it's an abuse of CSS? FWIW, I think it's a brilliant and simple solution, though the general sibling combinator sometimes feels like cheating in the best way possible.

defanor 8y ago
> Would it be more fair to say it's an abuse of CSS? In the sense of "improper usage", it applies to the resulting HTML with any CSS or without it at all; CSS is merely used here to make it look fine in some cases. Hacks can be clever and amusing (I was amused by this one too), but usually get rather annoying as they get used widely and break things.

untog 8y ago

I'm also very dubious about the accessibility implications. Hidden checkboxes and labels covering the entire screen don't feel great, though it's not my area of expertise.

freshm087 8y ago

Disabled CSS would leave such form still usable. It wouldn't look, and behave exactly as intended, for sure, but I suppose these days no one expects unchanged user experience while disabling CSS. Meanwhile, disabled JS on JS-based forms usually kills them.

defanor 8y ago
HTML/CSS as in the example would indeed be usable, though a similar version of this (with inline labels and checkboxes used for "aside" notes) gets rather messy when used in a textual browser or converted into another format. JS-based expansion doesn't have to get unusable either (it can merely hide bits of a document after loading, with those present in HTML), but perhaps could become unusable more easily. I'm not arguing for use of JS, by the way (not sure if it was clear), but rather for proper use of HTML.