爲什麼顯示：表格單元格受其他單元格中的元素影響

在CSS表格中，有人可以幫我瞭解爲什麼第一列中的填充元素會影響第二列中的div？爲什麼顯示：表格單元格受其他單元格中的元素影響

下面是一個段落有填充集的例子。右列中的DIV也被直接填充。在左列內容上指定行高時，我遇到了類似的問題，但簡化了此問題的示例。

http://jsfiddle.net/APXT7/2/

還有很多類似的/相關的有關表芯的問題，但我無法找到一個專門解決這個問題。

來源

2012-10-10 Nick Pearce

有意思。我從未見過這樣的效果。 –

我不確定我是否理解這個問題。你期望發生什麼？ – j08691

@ j08691我不想在右邊的「單元格」中的文字上方出現空白。我實際上希望這是一個帶有背景圖像的div，但它在示例中被簡化以演示問題 –

這很可能是行高的問題，而不是填充的問題之一。這意味着，雖然您可能會懷疑，沒有填充實際上正在傳播到右列（計算值仍然爲零）。我仍然稱它爲副作用調整您的p元素的填充。

p元素頂部和底部的填充將其基線向下推。這會導致同一行/行上的其他「單元格」的基線也發生移位。當然，你可以找到spec中列出的所有細節，但是因爲兩個「細胞」具有相同的垂直排列（baseline），所以他們必須排隊。

來源

2012-10-12 19:41:20 BoltClock

我覺得必須接受你的答案，因爲你提供了一個很好的解釋......雖然我現在留下的後續問題是在相鄰的「單元格」中以不同方式調整行高的最佳方法。看起來右側的單元格只受右側單元格中的FIRST元素的影響。 [更新jsfiddle]（http://jsfiddle.net/nickpearce/qnCkd/1）。我會創建一個新的問題。 –

您可能可以在單元類上使用vertical-align屬性（vertical-align:top），或者使用jsfiddle.net/j08691/APXT7/4之類的div。由於這些div被顯示爲表格單元格，因此這可能就是您要查找的內容。

來源

2012-10-14 22:23:40 j08691

謝謝@ j08691;這肯定回答我的後續問題，但要嚴格的第一個答案解決了我原來的'爲什麼？'的問題。 –

我發現了一個「修復」這個，但不知道爲什麼的黑客。 <div class='cell'>裏面的第一件東西就是<div class='hack'> </div>這個等級是.hack { height: 0; }這個如果放在左邊或者右邊的單元格

來源

2015-08-15 22:41:40

我相信你的答案現在就按預期顯示。如果需要，您可以自由編輯更多內容。謝謝回答！ –

爲什麼顯示：表格單元格受其他單元格中的元素影響

回答

相關問題