I have a table in a page that consists of checkboxes in the cells on the left and descriptions in the cells on the right. The "description" contains h4 headers and plain text. I want to make that whole description (everything inside <td></td>
) a label.
So each row looks like this:
<tr><td><input type="checkbox" name="entiries[]" value="i1" id="i1"></td> <td><label for="i1"> <h4>Some stuff</h4>more stuff.. <h4>Some stuff</h4>more stuff.. </label> </td></tr>
This does not work however, the text does not act like a label and is not clickable. I'm using Firefox 3.6 to test it. If I remove <h4>
tags it starts working, but that complicates formatting. Is there something about <h*>
tags that prevents <label>
from working correctly?
The for attribute is used in labels. It refers to the id of the element this label is associated with. Now when the user clicks with the mouse on the username text the browser will automatically put the focus in the corresponding input field. This also works with other input elements such as <textbox> and <select> .
There are two ways to pair a label and an input. One is by wrapping the input in a label (implicit), and the other is by adding a for attribute to the label and an id to the input (explicit). Think of an implicit label as hugging an input, and an explicit label as standing next to an input and holding its hand.
Div is a block element, so cannot go inside a label which will only accept Phrasing content. You may use <span> instead as that is an in-line element. SamA74: Div is a block element, so cannot go inside a label which will only accept Phrasing content.
The <label> tag can be used in two ways:The <label> tag needs a for attribute whose value is the same as input id. Alternatively, <input> tag use directly inside the <label> tag. In this case, the for and id attributes are not needed because the association is implicit.
Block level elements (to which h4
belongs) are not allowed inside inline elements, and will cause undefined behaviour. You can use span
elements instead.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With