--- layout: post title: ! 'HTML Semantics: br''s & control labels' tags: - Design - Development status: publish type: post published: true meta: _edit_last: '1' ---
<br />
elements break content. They don't space it.
This gave birth to a nice debate. I threw that tweet because I was facing a terrible blunder from a fellow designer. He was using <br />'s
to wrap an <hr />
just to give the ruler some space — instead of adding margins to it —. Paulo Zoom and Levi Figueira propelled the whole thing and I kinda moderated it. The end result was quite satisfying.
<br />
would be for:
TheThe idea of including an input inside a label —label
represents a caption in a user interface. The caption can be associated with a specific form control, known as thelabel
element's labeled control, either usingfor
attribute, or by putting the form control inside thelabel
element itself.
<label>Label: <input /></label>
— didn't convince Paulo as he thought it felt wrong. It's not that bad if you think of this particular example, for instance. Consider a series of checkboxes for a certain field. It would be handy if people knew they can click the text and select the checkbox too, right? Like this:
If you click the labels, the checkboxes are activated. And it's perfectly semantic as the labels work as controls alike.
Thank you, Paulo and Levi!