/*add to your css file*/
fieldset {
padding:10px;
line-height:2.0em;
}
label {
display:block;
width:80px;
}
.right label {
text-align:right;
float:left;
padding-right:3px;
}
.left label {
text-align:left;
float:left;
}
Labels above
<form action="processor.php" name="contact_form" class="above" method="post" onsubmit="return validate( );"> <fieldset> <legend>Contact form</legend> <label for="first">First</label><input type="text" name="first_name" id="first_name"> <label for="last">Last</label><input type="text" name="last_name" id="last_name"> <label for="email">Email</label><input type="text" name="email" id="email"> <label for="message">Message</label><textarea name="message" rows="10" cols="20"></textarea> <br style="clear:both;"/> <input type="submit"> </fieldset> </form>
Rendered
Labels align left
<form action="processor.php" name="contact_form" class="left" method="post" onsubmit="return validate( );"> <fieldset> <legend>Contact form</legend> <label for="first">First</label><input type="text" name="first_name" id="first_name"> <br style="clear:both;"/> <label for="last">Last</label><input type="text" name="last_name" id="last_name"> <br style="clear:both;"/> <label for="email">Email</label><input type="text" name="email" id="email"> <br style="clear:both;"/> <label for="message">Message</label><textarea name="message" rows="10" cols="20"></textarea> <br style="clear:both;"/> <input type="submit"> </fieldset>
Rendered
Labels align right
<form action="processor.php" name="contact_form" class="right" method="post" onsubmit="return validate( );"> <fieldset> <legend>Contact form</legend> <label for="first">First</label><input type="text" name="first_name" id="first_name"> <br style="clear:both;"/> <label for="last">Last</label><input type="text" name="last_name" id="last_name"> <br style="clear:both;"/> <label for="email">Email</label><input type="text" name="email" id="email"> <br style="clear:both;"/> <label for="message">Message</label><textarea name="message" rows="10" cols="20"></textarea> <br style="clear:both;"/> <input type="submit"> </fieldset> </form>
Rendered