HTML表 - 行之間的空間

對於同一個HTML表，我看到Firefox和Chrome之間的不同行爲。HTML表 - 行之間的空間

Firefox：行間距等分。

Chrome：行之間的空間不是等分的。

有人能告訴我發生了什麼事嗎？

在此先感謝。

<html> 
    <body> 
     <table border="1" width="100%"> 
      <tr> 
       <td rowspan="3">AAA</td> 
       <td>BBB</td> 
       <td rowspan="3"CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/>CCC<br/></td> 
      </tr> 
      <tr> 
       <td>BBB</td> 
      </tr> 
      <tr> 
       <td>BBB</td> 
      </tr> 
     </table> 
    </body> 
</html>

來源

2013-01-31 alereis

什麼，如果你看一下語法在鏈接提琴突出，你會發現有些事情是錯了你的HTML結構。這可能會或可能不會與問題有任何關係，但調試*正確* HTML更容易，更可靠。 –

如果您將'
'標記更改爲'
'，它會修正小提琴中的錯誤，但不會平衡Chrome中的間距。 –

這是與鍍鉻/ WebKit瀏覽器一個已知的渲染問題。

用戶在這裏提供了一個解決方案：Table cells bad rendering with Google Chrome/Webkit

來源

2013-01-31 20:45:01 Axel

感謝您的回答 – alereis

您需要使用<br/>代替<br>用接近的標籤。

在兼容的XHTML中，所有標籤都需要正確關閉。在這種情況下，您可以使用尾隨/來完成，而不是使用</br>關閉標籤。

<br></br>

相當於

<br/>

你會做同樣的事情與圖像元素：

<img src="..."/>

來源

2013-01-31 20:32:55

它修復了小提琴中的錯誤，但不會均衡Chrome中的間距。 – alereis

它沒有解決Chrome中的間距問題。 http://jsfiddle.net/p58Cf/ – alereis

也有類似的問題，在這裏我得到在Chrome行，但不是在其他瀏覽器之間1px的空間。當我在CSS中添加以下內容時就解決了這個問題。

td{ 
    padding: 0px 0px; 
    position:relative; 
}

關鍵是將td設置爲「position：relative」。由於某種原因它解決了這個問題。也許在這種情況下可能會有所幫助。

來源

2013-05-20 16:04:48

，如果你關閉第三<td...

<td rowspan="3"CCC 
<td rowspan="3">CCC

來源

2015-05-30 19:45:25 Apeiron

這並沒有提供問題的答案。要批評或要求作者澄清，在他們的帖子下留下評論 - 你總是可以評論你自己的帖子，一旦你有足夠的[聲譽]（http://stackoverflow.com/help/whats-reputation），你會能夠[評論任何帖子]（http://stackoverflow.com/help/privileges/comment）。 – Axalo

我無法評論。我需要50聲望;） – Apeiron

對不起，但這些是規則。見[這裏]（http://meta.stackexchange.com/questions/214173/why-do-i-need-50-reputation-to-comment-what-can-i-do-in-distead#answer-214174）。 – Axalo

HTML表 - 行之間的空間

回答

相關問題