表height屬性似乎沒有任何效果

我有HTML的結構是這樣的：表height屬性似乎沒有任何效果

<div class="wrapper"> 
<table> 
<tbody> 
<tr> 
<td>some content</td> 
</tr> 
</tbody> 
</table> 
</div>

我的包裝風格是這樣的：

.wrapper{ 
color: #444444; 
    height: 165px; 
    line-height: 135%; 
    margin-top: 10px; 
    padding-bottom: 10px; 
    width: 270px; 
}

和我的表只有寬度與一些繼承的風格一起定義：

.wrapper> table { 
    width: 100%; 
} 
table { 
    background-color: transparent; 
    border-collapse: collapse; 
    border-spacing: 0; 
    max-width: 100%; 
} 
table { 
    border-collapse: collapse; 
    border-spacing: 0; 
}

我想要做的是，我的表消耗父元素的最大高度是.wrapper其高度值爲165px，但由於某種原因，桌子高度不會下降。

我的最終目標是在包裝上設置一個y-overflow，所以如果表變大，.wrapper用戶可以滾動，我在這裏丟失什麼提示？

當我改變工作臺的高度爲>然後190px，表反應也逐漸變大，但如果我更改爲更小的尺寸，即165像素或以下任何190px似乎並不如果你希望它迴應

來源

2012-11-04 London

您在表格上根本不使用任何高度屬性。你期望影響桌子的高度是什麼？ – Guffa

添加'高度：100％'或任何高度都不會改變任何東西，這就是爲什麼我要求我不知道下一步該怎麼做 – London

添加'height：100％'確實會改變表格的高度。請參閱下面的答案中的演示。 – Guffa

Addig height: 100%表樣式並使其繼承父元素的高度：

.wrapper> table { 
    width: 100%; 
    height: 100%; 
}

演示：http://jsfiddle.net/WDFa2/

注：該表秉承高度的中的指定高度父母，即165px，而不是包括填充的身高，即175px。

來源

2012-11-04 15:56:29 Guffa

100%高，給它height: 100%。目前你根本沒有指定高度。

請記住，表格往往不遵守所有高度規則。如果內容不合適，他們可能會有點固執。 ;）

來源

2012-11-04 15:32:42 GolezTrol

添加'高度：100％'或任何高度都不會改變任何內容 – London

嘗試將高度規則賦予表格單元格... – Eamonn

表height屬性似乎沒有任何效果

回答

相關問題