Code
<form>
<div class="control">
<label for="name">Full name</label><input id="name" type="text" />
</div>
<div class="control">
<label for="biography">Biography</label><textarea id="biography"></textarea>
</div>
<div class="control">
<label for="image">Image</label><input id="image" type="file" />
</div>
<fieldset>
<legend>Gender</legend>
<div class="control">
<input id="gender_male" name="gender" type="radio" /><label for="gender_male">Male</label>
</div>
<div class="control">
<input id="gender_female" name="gender" type="radio" /><label for="gender_female">Female</label>
</div>
</fieldset>
<fieldset>
<legend>Hobbies</legend>
<div class="control">
<input id="hobbies_hiking" type="checkbox" /><label for="hobbies_hiking">Hiking</label>
</div>
<div class="control">
<input id="hobbies_dancing" type="checkbox" /><label for="hobbies_dancing">Dancing</label>
</div>
<div class="control">
<input id="hobbies_gardening" type="checkbox" /><label for="hobbies_gardening">Gardening</label>
</div>
</fieldset>
<div class="control">
<label for="age_group">Age Group</label><select id="age_group">
<option>
0 to 9 Years
</option>
<option>
10 to 19 Years
</option>
<option>
20 to 29 Years
</option>
<option>
30 to 39 Years
</option>
<option>
40 to 49 Years
</option>
<option>
50 to 59 Years
</option>
<option>
60 to 69 Years
</option>
<option>
70 to 79 Years
</option>
<option>
80 to 89 Years
</option>
<option>
90 to 99 Years
</option>
</select>
</div>
<div class="control">
<label for="idol">Idol</label><select id="idol" size="2">
<option>
Michael Jackson
</option>
<option>
Jesus
</option>
<option>
Mahatma Gandhi
</option>
<option>
John Doe
</option>
</select>
</div>
<div class="control">
<label for="interests">Interests</label><select id="interests" multiple="">
<option>
Readings
</option>
<option>
Cinemas
</option>
<option>
Theaters
</option>
<option>
Operas
</option>
<option>
Concerts
</option>
</select>
</div>
<div class="control">
<label for="favourite_car">Favourite Car</label><select id="favourite_car"><optgroup label="Swedish Cars">
<option>
Volvo
</option>
<option>
Saab
</option>
</optgroup><optgroup label="German Cars">
<option>
Mercedes
</option>
<option>
Audi
</option>
</optgroup></select>
</div>
<div class="control">
<label for="my_bike">Favourite Dish</label><select id="my_bike" size="2"><optgroup label="Vegetarian">
<option>
Green Salad
</option>
<option>
French Fries
</option>
</optgroup><optgroup label="Carnivorous">
<option>
Big Mac
</option>
<option>
Roast Beef
</option>
</optgroup></select>
</div>
<div class="control">
<label for="public_transports">Public transports</label><select id="public_transports" multiple=""><optgroup label="Ground">
<option>
Train
</option>
<option>
Bus
</option>
</optgroup><optgroup label="Water">
<option>
Ship
</option>
<option>
Submarine
</option>
</optgroup><optgroup label="Air">
<option>
Plane
</option>
<option>
Cable Car
</option>
</optgroup></select>
</div>
<div class="control">
<input id="accept_agbs" type="checkbox" /><label for="accept_agbs">I accept the terms and conditions</label>
</div>
<div class="control">
<input type="submit" value="Register" />
</div>
</form>
.control, fieldset {
margin: 6px 0;
}
label {
display: inline-block;
width: 120px;
vertical-align: top;
}
input + label {
width: auto;
}