blob: f92724076af655b4a5c737d9e00ac7679ea4b31d (
plain)
1
|
<html>
<head>
<style type="text/css">
form.myform {
margin-left: 155px;
width: 300px;
}
form.myform fieldset {
margin-bottom: 10px;
margin-left: -155px;
background: #d0d9fd;
}
form.myform legend {
padding: 0 2px;
font-weight: bold;
font-size: 1.3em;
}
form.myform fieldset ul {
margin: 0 0 0 155px;
padding: 0;
}
form.myform fieldset li {
list-style: none;
padding: 10px;
margin: 0;
clear: both;
}
form.myform label {
font-weight: bold;
float: left;
text-align:right;
margin-left: -155px; /*width of left column*/
width: 150px; /*width of labels. Should be smaller than left column (155px) to create some right margin*/
}
form.myform p{
margin-left: 155px;
}
form.myform input, form.myform textarea {
border: solid 1px #85b1de;
background: #fff url('formbg.gif') repeat-x;
background-position: top;
}
form.myform input:focus, form.myform textarea:focus
{
background-image: none;
background-color: #ffffff;
border: solid 1px #fded7f;
}
</style>
</head>
<body>
<form action="#" class="myform">
<fieldset>
<legend>Leave a Comment</legend>
<ul>
<li>
<label for="name">Name:</label>
<input id="name" />
</li>
<li>
<label for="email">Email:</label>
<input id="email" />
</li>
<li>
<label for="comment">Comments:</label>
<textarea id="comments" rows="7" cols="25"></textarea>
</li>
<li>
<label for="remember">Remember Me:</label>
<input type="radio" name="remember" value="true" />Yes
<input type="radio" name="remember" value="false" checked/>No
</li>
</ul>
</fieldset>
<p><input type="submit" value="Leave comment" /></p>
</form>
</body>
</html>
|
