H1 CSS重置失敗？

Question

我試圖弄清爲什麼標題鏈接（在左邊）和導航欄中的其他鏈接（右邊）的高度不一樣。

所不同的是在Safari微妙，但在IE6更大。

我錯過了什麼在H1的CSS重置？

SAFARI
alt text http://img218.imageshack.us/img218/702/safari.png

IE6
alt text http://img64.imageshack.us/img64/870/ie6.png

的HTML

<div id="navbar"> 
    <table width="100%" border="0" cellspacing="0" cellpadding="0"> 
    <tr> 
     <td align="left"> 
      <h1><a href="http://ide.as">title</a></h1> 

     </td> 
     <td align="right"> 
      <a href="about.html" class="color1">about</a> 
      <a href="faq.html" class="color2">answers</a> 
      <a href="contact.html" class="color3">contact</a> 
      <input type="text" name="search" value="" id="searchbox">&nbsp;<a class="color4" href="sss">search</a> 
     </td> 
    </tr> 
    </table> 
    </div> 

和CSS

#navbar a, h1 a { padding: 3px 5px; vertical-align: middle;} 

H1已經重新

h1 {margin:0;padding:0;} 
h1 {font-size:100%;font-weight:normal;} 

Answer 1

我想這是因爲右表中的單元格中的文本輸入導致該表格單元格「拉伸」一點比左邊的表格單元格高（這將是上取決於他們如何大繪製文本不同的瀏覽器略有不同輸入框），從而排除對齊點。嘗試vertical-align：bottom;在左邊的表格單元格中。

Answer 2

h1 a { padding: 3px 5px; vertical-align: middle;} 

設置一個H1中的一個鏈接的樣式，而不是H1本身。

h1 {margin:0;padding:0;} 
h1 {font-size:100%;font-weight:normal;} 

設置h1的樣式。所以鏈接的樣式仍然存在，它們沒有被覆蓋。

Answer 3

中有不同的方式，瀏覽器呈現的造型了一些非常細微的差別。這只是另一個例子。

要查看這一個很好的例子，嘗試尋找在各個瀏覽器中Acid 2測試，看看一些不同之處。

Answer 4

首先，如果出現這種情況的跨瀏覽器，使用Firefox中的Firebug告訴你在哪裏元素的樣式規則的來源。

其次，我會檢查<a>和<h1>上的線高度以及<a>上的邊距。