0

Hi

I'm trying to get the labels of my form to appear above their input boxes and for the input boxes themselves to be side by side (basically a horizontal login form)

I've used the label tag in my form after doing some research which looks like:

<form> 
<label for="email">Email</label> <br /> 
<input type="text" name="email" /> 
<label for="password">Password</label> <br /> 
<input type="text" name="password" /> 
</form>

In my CSS I have a label property defined as:

label { 
display:inline-block; 
}

But the outcome is this:
http://i56.tinypic.com/10r0c1s.png

Could anyone please shed some light on my problem?

Thank you

1
Contributor
1
Reply
4
Views
6 Years
Discussion Span
Last Post by dsmush
0

Solved

HTML

<form>
<div class="group">
<label for="email">Email</label> <br />
<input type="text" name="email" />
</div>

<div class="group">
<label for="password">Password</label> <br />
<input type="text" name="password" />
</div>
</form>

CSS

.group{
display: inline-block;
}
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.