DZone Snippets is a public source code repository. Easily build up your personal collection of code snippets, categorize them with tags / keywords, and share them with the world

Stephen has posted 20 posts at DZone. View Full User Profile

Form Layout Using Css Not Tables

  • submit to reddit
        Display forms using CSS rather than Tables

<html xmlns="">
    <title>Layout Form without Tables</title>
    <style type="text/css">
        background-color: #f3f3f3;
        border: solid 1px #a1a1a1;
        padding: 10px;
        width: 300px;
    .formLayout label, .formLayout input
        display: block;
        width: 120px;
        float: left;
        margin-bottom: 10px;
    .formLayout label
        text-align: right;
        padding-right: 20px;
        clear: left;
    <div class="formLayout">
        <label>First Name</label>
        <input id="name" name="name"><br>
        <label>Last Name</label>
        <input id="Text1" name="name"><br>
        <input id="address1"><br>
        <input id="address2"><br>
        <select id="city">
            <option>New York</option>
        <input id="zip"><br>