HTML标签用于填充单元格高度，具有某种形式的填充

Question

我正在尝试获得一个标签来填充表格单元格，同时在标签上应用了某种填充。

我尝试过通过搜索找到的方法，但这似乎不起作用......这是我的CSS：

tr {
    height: 1px;
}

td {
    height:100%;        
}

label {
    background-color: #DCDCDC;
    display: block; 
    font-weight:bold;
    vertical-align:top;
    text-align:right;  
    padding: 8px 5px 8px 8px;
    margin:  1px 3px 1px 0px;     
    min-width: 120px;
    min-height:100%;    
    height:auto !important;
    height:100%;
}

如有任何帮助，将不胜感激

Answer 1

从给定的CSS看起来，表格单元格上可能存在浏览器默认填充。

td {padding: 0;}
label {display: block; padding: 1em;}

似乎为我做了诀窍：http://jsfiddle.net/Fb7bS/

但是更复杂的表和/或来自其他地方的继承样式可能会增加复杂性。

Answer 2

Hy，我很久以前就遇到过这个问题。似乎某种web浏览器为表格添加了标准填充和边距。 他们添加了多少，总是取决于webbrowser。 但要克服这个问题，你应该考虑css重置的方法。 那是什么 ？ 您只需添加一个包含在HTML页面中的.css文件，该文件将所有边距/填充和默认情况下完成的其他编队设置为零。有了这个，你可以避免这些问题CSS重置链接：http://meyerweb.com/eric/tools/css/reset/

Answer 3

好吧，在旧版浏览器中，标签不能设置为块级元素。你可以尝试在标签中放置一个div并将标签的样式转移到div，看看是否能解决你的问题。

虽然height: 100%也可以工作，但元素必须绝对定位，并且父元素相对定位，但在某些浏览器中，像td这样的表元素也不能相对定位。另外，除非td意图垂直填满屏幕的整个长度，否则两个元素上的height: 100%无论如何都是不必要的。

我删除了一些“不必要的”代码，并在这里改变了你的格式，虽然我不确定你想要什么，所以它可能会变得不那么不必要，而其他东西只是缺失：http://jsfiddle.net/mGykJ/1/

你能看出这更像你的想法吗？虽然如果你可以发布你的HTML，那将是有帮助的。