jzfla
02-07-2007, 04:23 PM
I am trying to create a web form without tables, just CSS something like this:
First Name: ____________ Last Name: __________________
Address: ________________________________________
City: _____________________ State: ___ Zip: ______
Is there anyway in CSS to do this without using tables?
I am able to create a form that looks like this:
First Name: ____________________
Last Name: ____________________
Address: ________________________________
City: _________________
State: ___
Zip: _________
using this CSS code:
body
{
margin:0 auto;
width:740px;
background:#f4f4f4;
}
#input_form
{
font-family:Georgia,Arial;
font-size:.65em;
margin-top:60px;
background:#ffffff;
padding-top:20px;
}
form label
{
float:left;
width:150px;
text-align:right;
margin-right:.7em;
padding-top:.3em;
}
form input
{
font-family:Georgia,Arial;
background:#ffffcc;
font-size:1em;
margin-bottom:2px;
}
and this HTML:
<label for="last_name">First Name</label>
<input type="text" name="first_name" id="first_name" size="20" maxlength="30" /><br />
<label for="last_name">Last Name:</label>
<input type="text" name="last_name" id="last_name" size="15" maxlength="35" /><br />
<label for="first_name">Street Address:</label>
<input type="text" name="first_name" id="Address" size="50" maxlength="50" /><br />
<label for="last_name">City:</label>
<input type="text" name="last_name" id="City" size="50" maxlength="50" /><br />
<label for="last_name">State:</label>
<input type="text" name="last_name" id="State" size="2" maxlength="2" /><br />
<br />
Many thanks for any help!
First Name: ____________ Last Name: __________________
Address: ________________________________________
City: _____________________ State: ___ Zip: ______
Is there anyway in CSS to do this without using tables?
I am able to create a form that looks like this:
First Name: ____________________
Last Name: ____________________
Address: ________________________________
City: _________________
State: ___
Zip: _________
using this CSS code:
body
{
margin:0 auto;
width:740px;
background:#f4f4f4;
}
#input_form
{
font-family:Georgia,Arial;
font-size:.65em;
margin-top:60px;
background:#ffffff;
padding-top:20px;
}
form label
{
float:left;
width:150px;
text-align:right;
margin-right:.7em;
padding-top:.3em;
}
form input
{
font-family:Georgia,Arial;
background:#ffffcc;
font-size:1em;
margin-bottom:2px;
}
and this HTML:
<label for="last_name">First Name</label>
<input type="text" name="first_name" id="first_name" size="20" maxlength="30" /><br />
<label for="last_name">Last Name:</label>
<input type="text" name="last_name" id="last_name" size="15" maxlength="35" /><br />
<label for="first_name">Street Address:</label>
<input type="text" name="first_name" id="Address" size="50" maxlength="50" /><br />
<label for="last_name">City:</label>
<input type="text" name="last_name" id="City" size="50" maxlength="50" /><br />
<label for="last_name">State:</label>
<input type="text" name="last_name" id="State" size="2" maxlength="2" /><br />
<br />
Many thanks for any help!