Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
input[type=text]:focus { background:#e4f0f8 }
.formexample {
    width:80%;
    border:1px solid #000;
    margin:20px auto;
    text-align:left;
}
.formtest { background:#f9f9f9; }
.formtest fieldset {
    padding:20px;
    margin:0 auto;
    border:none;
    display:table;
    width:1px;
 *display:inline;/* ie6/7 hack for inline block */
    zoom:1.0;/* ie6/7 hack for inline block */
    vertical-align:middle;
}
.formtest label {
    display:inline-block;
    vertical-align:middle;
    width:150px;
    text-align:right;
    margin:5px 0;
}
.formtest input {
    min-width:150px;
    margin:5px 0;
    vertical-align:middle;
    border:1px solid #ddd;
    text-align:left;
}
input.address { width:250px }
.formtest div{white-space:nowrap}
.submit {
    display:block;
    text-align:right
}
#submit {
    border:1px solid #000;
    color:#000;
    padding:0;
    overflow:hidden;
    height:25px;
    width:80px;
    font-weight:bold;
    margin:10px 0;
    display:inline;
    text-align:center;
}
#submit:hover {
    background:#000;
    color:#fff
}
</style>
</head>
​
<body>
<div class="formexample">
        <form  class="formtest" id="form1" method="post" action="">
                <fieldset>
                        <legend>Address Details</legend>
                        <div>
                                <label for="firstname">First Name:</label>
                                <input type="text" name="firstname" id="firstname name" />
                        </div>
                        <div>
                                <label for="lastname">Last Name:</label>
                                <input type="text" name="lastname" id="lastname value" />
                        </div>
                        <div>
                                <label for="address1">Address 1:</label>
                                <input class="address" type="text" name="address1" id="address1" />
                                <br>
                        </div>
                        <div class="submit">
                                <input type="submit" name="submit" id="submit mybutton" value="Submit" />
                        </div>
                </fieldset>
        </form>
</div>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers