Demo of Horizontal Form with bootstrap design
HTML
<form class='form-horizontal'>
<div class='form-group'>
<label for='name' class='col-md-2 control-label'>Name</label>
<div class='col-md-4'>
<input type='text' class='form-control' id='name' name='name' placeholder='Name'>
</div>
</div>
<div class='form-group'>
<label for='f_email' class='col-md-2 control-label'>Email</label>
<div class='col-md-4'>
<input type='email' class='form-control' id='f_emal' name='Email' placeholder='Email'>
</div>
</div>
<div class='form-group'>
<label for='f_doa' class='col-md-2 control-label'>Sex</label>
<div class='col-md-4'>
<div class='radio-inline'>
<label><input type='radio' name='r1' id='r1' value='option1' checked>Option 1</label>
</div>
<div class='radio-inline'>
<label><input type='radio' name='r1' id='r2' value='option2' >Option 2</label>
</div>
</div>
</div>
<div class='form-group'>
<label for='f_doa' class='col-md-2 control-label'>Adults No. </label>
<div class='col-md-2'>
<select class='form-control' name='s1' id='s1'>
<option>Option one </option>
<option>Option two</option>
<option>Option Three</option>
<option>Option Four</option>
</select>
</div>
</div>
<div class='form-group'>
<label for='f_doa' class='col-md-2 control-label'>Description </label>
<div class='col-md-4'>
<textarea rows=4 class='form-control' id='description' name='description' placeholder='Description'></textarea>
</div>
</div>
<div class='form-group'>
<label for='f_doa' class='col-md-2 control-label'>Agreement. </label>
<div class='col-md-4'>
<div class='checkbox-inline'>
<label><input type='checkbox' value='opt1' name=c1 id=c1> Agree to Terms and Conditions</label>
</div>
</div>
</div>
<div class='form-group'>
<div class='col-md-2'> </div><div class='col-md-2'><button type='button' class='btn btn-danger' id=b1>Submit</button></div>
</div>
</form>