aligning input fields horizontally

Hi.

I am creating a php form that needs certain input fields aligning next to each other to compress the size of it because it is quite a large form.

Is there any way you know how to edit the css to make them align next to each other.

Here is the css:

[CODE] body {
font-family:Arial, Tahoma, sans-serif;
}
#contact-wrapper {
width:550px;
border:1px solid #e2e2e2;
background:#f1f1f1;
padding:20px;
}
#contact-wrapper div {
clear:both;
margin:1em 0;
height:auto;
}
#contact-wrapper label {
display:block;
float:none;
font-size:16px;
width:auto;
}
form#contactform input {
border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
border-style:solid;
border-width:1px;
padding:4px;
font-size:16px;
color:#333;
}
form#contactform textarea {
font-family:Arial, Tahoma, Helvetica, sans-serif;
font-size:100%;
padding:0.6em 0.5em 0.7em;
border-color:#B7B7B7 #E8E8E8 #E8E8E8 #B7B7B7;
border-style:solid;
border-width:1px;
position:absolute;
}
#email{
float:left;
width:200px;
left:0px;
}
#telephone{
float:left;
display:block;
}
#horiinput{
float:none;
}[/CODE]

Here is the html markup for the form;

[code=html]<div id=”contact-wrapper”>

<?php if(isset($hasError)) { //If errors are found ?>
<p class=”error”>Please check if you’ve filled all the fields with valid information. Thank you.</p>
<?php } ?>

<?php if(isset($emailSent) && $emailSent == true) { //If email is sent ?>
<p><strong>Email Successfully Sent!</strong></p>
<p>Thank you <strong><?php echo $name;?></strong> for using my contact form! Your email was successfully sent and I will be in touch with you soon.</p>
<?php } ?>

<form method=”post” action=”<?php echo $_SERVER[‘PHP_SELF’]; ?>” id=”contactform”>
<div>
<label for=”name”><strong>Full Name:</strong></label>
<input type=”text” size=”50″ name=”contactname” id=”contactname” value=”” class=”required” />
</div>

<div>
<label for=”company name”><strong>Company Name:</strong></label>
<input type=”text” size=”50″ name=”companyname” id=”companyname” value=”” class=”required” />
</div>
<div id=”horiinput”>
<div id=”email”>
<label for=”email”><strong>Email:</strong></label>
<input type=”text” size=”20″ name=”email” id=”email” value=”” class=”required email” />
</div>
<div id=”telephone”>
<label for=”telephone”><strong>Telephone:</strong></label>
<input type=”text” size=”25″ name=”telephone” id=”telephone” value=”” class=”required” />
</div>
</div>
<div>
<label for=”whentocall”><strong>When should we call you?:</strong></label>
<input type=”text” size=”25″ name=”whentocall” id=”whentocall” value=”” class=”required” />
</div>
<div>
<label for=”whichplan”><strong>Which plan?:</strong></label>
<input type=”text” size=”25″ name=”whichplan” id=”whichplan” value=”” class=”required” />
</div>
<div>
<label for=”whichphone”><strong>Which phone?:</strong></label>
<input type=”text” size=”25″ name=”whichphone” id=”whichphone” value=”” class=”required” />
</div>
<div>
<label for=”whatbusiness”><strong>Type of business?:</strong></label>
<input type=”text” size=”25″ name=”whatbusiness” id=”whatbusiness” value=”” class=”required” />
</div>
<div>
<label for=”employees”><strong>Number of employees?:</strong></label>
<input type=”text” size=”25″ name=”employees” id=”employees” value=”” class=”required” />
</div>
<div>
<label for=”lines”><strong>Existing number of lines?:</strong></label>
<input type=”text” size=”25″ name=”lines” id=”lines” value=”” class=”required” />
</div>
<div>
<label for=”extensions”><strong>Existing number of extensions?:</strong></label>
<input type=”text” size=”25″ name=”lines” id=”lines” value=”” class=”required” />
</div>
<div>
<label for=”notes”><strong>Comments</strong></label>
<textarea rows=”3″ cols=”50″ name=”comments” id=”comments” class=”required”></textarea>
</div>
<input type=”submit” value=”Send Message” name=”submit” />
</form>
</div>[/code]

Any help on this would be amazing thanks,

Mark

Also in #CSS _↴