I'm trying to build my simple form in a way that the the name of the of the field will be aligned to the right side of the field (with some space of course) and all the fields will be in a straight line on their right side.
How can I do it without tables?
My code:
<form id="test" action="#" method="post">
<label for="nameName</label> <input type="text" id="name" name="name" />
<label for="city">City</label> <input type="text" id="city" name="city" />
<label for="email">Email</label> <input type="text" id="email" name="email" />
<input type="submit" name="submit" id="submit" value="send" />
</form>
Thanks!<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>
<style type="text/css">
fieldset {padding:1ex; width:12em}
label {display:block; margin:1ex; text-align:right}
input {margin-left:1ex; width:7em}
button {display:block; margin:auto}
</style>
</head>
<body>
<form action="some-script.pl">
<fieldset>
<legend>Example</legend>
<label>Name<input name="name" type="text"></label>
<label>City<input name="city" type="text"></label>
<label>E-mail<input name="eMail" type="text"></label>
<button type="submit">Send</button>
</fieldset>
</form>
</body>
</html>Nice & Simple - Thanks Charles
How can I do it without tables?
My code:
<form id="test" action="#" method="post">
<label for="nameName</label> <input type="text" id="name" name="name" />
<label for="city">City</label> <input type="text" id="city" name="city" />
<label for="email">Email</label> <input type="text" id="email" name="email" />
<input type="submit" name="submit" id="submit" value="send" />
</form>
Thanks!<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta name="Content-Script-Type" content="text/javascript">
<meta name="Content-Style-Type" content="text/css">
<title>Example</title>
<style type="text/css">
fieldset {padding:1ex; width:12em}
label {display:block; margin:1ex; text-align:right}
input {margin-left:1ex; width:7em}
button {display:block; margin:auto}
</style>
</head>
<body>
<form action="some-script.pl">
<fieldset>
<legend>Example</legend>
<label>Name<input name="name" type="text"></label>
<label>City<input name="city" type="text"></label>
<label>E-mail<input name="eMail" type="text"></label>
<button type="submit">Send</button>
</fieldset>
</form>
</body>
</html>Nice & Simple - Thanks Charles