Html 表单边距在Safari中有所改变，但在firefox和IE中看起来不错

有问题的网页是www.guardinglight.com/contact.html 该网站在Firefox和IE中看起来不错，但Safari中的形式空白正在改变。 这是我第一次开发一个网站，任何帮助都将不胜感激。谢谢 HTML：

<div id="contact">
<div id="contact_form">
<form method="post" action="contactengine.php" id="commentForm">    
<fieldset>
<h1 id="contact_text">Please fill out the from below and we will contact you shortly.</h1>
<div id="formLeft"><label for="Name">Name:</label>
<div class="input-bg"><input type="text" name="Name" id="Name" class="required"></div>
<label for="Phone">Phone Number:</label>
<div class="input-bg"><input type="text" name="Tel" id="Tel"></div>
<label for="Email">Email:</label>
<div class="input-bg"><input type="email" name="Email" id="Email" class="required email"></div>
<label for="Message">Message:</label>
<div class="message-bg">
<textarea name="Comment" id="Comment" rows="20" cols="20" class="required">
</textarea></div>
<br>
<input type="image" src="images/submit-button.png" name="submit" value="Submit" class="submit-   button" alt="submit"></div>
</fieldset>
</form>
</div>    

或者更好的方法是，使用#contact_表单设置填充

由于您在#formLeft中使用了一个float，您可能希望在#contact#u表单结束之前清除它

<div id='contact_form'>  
  <!-- content -->
  <div style='clear: both;'></div>
</div>

< /代码> 您可能想考虑使用。它们确实有助于解决跨浏览器的边距和填充不一致的问题

因为每个浏览器都有一组默认样式，所以CSS会在设置站点样式之前重置公平竞争环境

埃里克·迈耶非常擅长捕捉大多数不一致之处

form { display: block; } 

<div id='contact_form'>  
  <!-- content -->
  <div style='clear: both;'></div>
</div>