html - Alignment of form fields -
i trying create form create new user website. have form fields horizontally aligned, create nicer. have tried doing using simple css, cannot work*.
<html> <form name="newuserform" method="post" action="createuserscript.php"> <p>username: <input name="username" type="text" autofocus class="formfield"> </p> <p>e-mail: <input name="email" type="text" class="formfield"> </p> <p>password: <input name="password" type="text" class="formfield"> </p> <p>repeat password: <input name="passwordrepeat" type="text" class="formfield"> </p> <p>administrator: <input type="checkbox" name="isadmin" class="formfield"> </p> </form> </html> and css .formfield class is
.formfield { margin-left: 150px; width: 200px; } the whole thing located in <div> next properties (i dont know if has say)
#content { padding: 10px; margin-left: 250px; font-family: arial; } currently seems making margin text ends, not sure. missing here?
*i find crazy workaround create work, cannot think of seems reasonable.
this i'd (using labels):
<html> <style type="text/css"> label{display:block; float:left; width:130px;} .formfeild{width:200px;} p{clear:both; margin-bottom:5px;} </style> <form name="newuserform" method="post" action="createuserscript.php"> <p><label>username:</label><input name="username" type="text" autofocus class="formfield"> </p> <p><label>e-mail:</label><input name="email" type="text" class="formfield"> </p> <p><label>password:</label><input name="password" type="text" class="formfield"> </p> <p><label>repeat password:</label><input name="passwordrepeat" type="text" class="formfield"> </p> <p><label>administrator:</label><input type="checkbox" name="isadmin" class="formfield"> </p> </form> </html> html css forms alignment margin
No comments:
Post a Comment