Clever Geek Handbook

Label and input field in one line

I have the following html:

<label>blah</label>
<input type=text ... />

I want the label to be on one line and below the input field.

It is currently on the same line, do I need to use clear?

+2


source to share


6 answers


Do it with CSS:



label {clear: both; }

+1


source


You can put a class or css style that will change the display to block:



<label style="display:block">blah</label>
<input type=text ... />
+9


source 


<label>blah</label>
<br />
<input type=text ... />

Use a line break.

+5


source 


<label for="fldAge">Age:</label>
<p>
<input type="text" name="Age" id="fldAge" />
</p>

It also forces the browser to display the text associated with the input with the focus rectangle and allows the user to focus the field by clicking anywhere in the associated text, not just by manipulating the input field.

+3


source


You can do throw ( <br />

) in between, or place each in its own div.

+1


source


The easiest way is to add <br>

after </label>

.

Alternatively you can use div tags or a table with two lines.

+1


source






More articles:


All Articles