With this markup:
<label for="example">
<textarea id="example" cols="40" rows="10"></textarea>
</label>
The label does not expand with the textarea and hence the textarea pushes itself under the following fields in the form.
Does anyone know how to get the label to expand to the size of the textarea using CSS?
I’ve tried:
label { display: table; }
and all kinds of margins and padding on both the label and the textarea, but to no avail.
I think you’ll need to close the text area properly, i.e with a closing </textarea> tag – though, I’m unsure of the use of label in this way – perhaps the for attribute is made redundant by enclosing the target element with the label tags. :shrugs:
Removing the </textarea> tag from the below example makes the check-box disappear, the point being that page display is broken if the tag is omitted. 🙂