Trying to create a layout I like for this form has been a bit of a struggle. I thought I had something good at first, but after the first row of input, the formatting gets all messed up and I can't figure out what's going wrong.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
<head>
<title>Add Company</title>
<style>
/* Style for add_client form */
fieldset#add_field {
width:830px;
}
fieldset#Basic_Info, fieldset#Address {
width: 46%;
float:left;
}
fieldset lebel {
float: left;
width: 45%;
}
fieldset label, label span {
display: block;
padding-bottom: .25em;
}
fieldset#add_field span {
float: left;
text-align: right;
width: 44%;
}
fieldset#add_field input {
float:right;
width: 44%;
border-width: 1px;
border-style: solid;
}
fieldset#add_field select {
float:right;
width: 45%;
}
</style>
</head>
<body><div id='content'>
<fieldset id='add_field'>
<legend>Add Company</legend>
<fieldset id='Basic_Info'>
<legend>Basic Info</legend>
<label for="name"><span>Company Name</span><input id="name" /></label>
<label for="phone"><span>Phone Number</span><input id="phone" /></label>
<label for="status"><span>Status</span>
<select id='status'>
<option>1. Lead</option>
<option>2. Initial Contact</option>
<option>3. Negotiation</option>
<option>4. Client</option>
<option>5. Previous Client</option>
</select>
</label>
</fieldset>
<fieldset id='Address'>
<legend>Address</legend>
<label for="county"><span>Street Address</span><input id="county" /></label>
<label for="city"><span>City</span><input id="city" /></label>
</fieldset>
</fieldset>
<input style='margin-top: 20px;' type="submit" value="Submit" id='jqxSubmitButton' />
</div>
</body>
</html>