CODEWITHSUNDEEP
htmlcss
mrblah
mrblah

Reputation: 103507

label and input box on the same line

I have a the following html:

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

I want the label to be on one row, and below it the input box.

currently it is on the same line, do I have to use a clear?

Upvotes: 3

Views: 25044

Answers (6)

Josh
Josh

Reputation: 1001

Do it with CSS:

label { clear: both; }

Upvotes: 2

Alex Pavlov
Alex Pavlov

Reputation: 598

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

This also causes the browser to render text associated with an input with a focus rectangle, and enables the user to focus the field by clicking anywhere in the associated text instead of just the input field control.

Upvotes: 3

atfergs
atfergs

Reputation: 1684

You could throw in a breakline (<br />) between them or put each in its own div.

Upvotes: 1

Jonathan Holloway
Jonathan Holloway

Reputation: 63672

The simplest way is to add a <br> after </label>.

Alternatively you could use div tags or a table with two rows.

Upvotes: 1

Mike Hall
Mike Hall

Reputation: 1151

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

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

Upvotes: 10

Brandon
Brandon

Reputation: 69983

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

Use a line break.

Upvotes: 5

Related Questions