Form Problem in ONLY IE6 and IE7 - html

Question

For some reason the form inputs are pushing off the left margin.. I have no clue why!
Below is the link..
http://mimedx.com/mg/contactus.php
I have no clue why this is happening. Probably Microsoft being Microsoft and having some random rule that conflicts with standards..
CSS:
#content form { overflow: hidden; width: 550px; }
#content form ul { padding: 0; }
#content form li { list-style: none; float: left; width: 250px; padding: 4px 0; }
#content form label { display: block; width: 100px; line-height: 15px; font-size: 1em; padding-bottom: 2px; font-weight: bold;}
#content form input { display: block; width: 200px; padding: 4px; margin: 0; line-height: 14px; font-size: .9em; background-color: #f7f7f7; border: 1px solid #d4d4d4; color: #4d4d4d; }
HTML:
<form action="/mail.php" method="post" name="contactForm" id="contactForm">
<ul>
<li>
<label for="first_name">First Name</label>
<input type="text" name="first_name" id="first_name" />
</li>
<li>
<label for="last_name">Last Name</label>
<input type="text" name="last_name" id="last_name" />
</li>
<li>
<label for="phone">Phone</label>
<input type="text" name="phone" id="phone" />
</li>
<li>
<label for="email">Email</label>
<input type="text" name="email" id="email" />
</li>
<li class="full">
<label for="comments">Comments</label>
<textarea name="comments" id="comments"></textarea>
</li>
<li>
<input type="submit" name="submit" id="submit" value="Submit" />
</li>
</ul>
</form>

Answer 1

The list elements are responsible, quite a common problem in IE.
Try setting
#content form ul { margin: 0; }
#content form li { margin: 0; }
More generally, you might find using a reset css useful. This removes browser specific styling and gives you a 'blank canvas' to work from. I always use the YUI Reset but there are plenty of options out there.