kol*_*cun 18 css html5 html-table cross-browser padding
我把它简化为一个相当简单的例子.
对我来说,它在Chrome 7.0中与在Firefox 3.6.12中看起来不同.IE 9 beta看起来像Chrome.
我希望能够在TD上设置填充,并使其在所有浏览器中以相同的高度渲染.目前,使用10px顶部填充,Chrome中的单元格看起来比Firefox更高.
我尝试过使用Eric的重置css,它不会改变结果任何想法为什么这些都被渲染得不同？
它的外观如下所示 - http:// yfrog.COM/5zqa7p
而代码......
<!DOCTYPE html>
<head>
<title>padding test</title>
<meta charset=utf-8>
<style>
td { width: 100px; height:100px; background: green; padding: 10px 0 0 0; }
</style>
</head>
<body>
<table>
<tr><td>TEST</td></tr>
<tr><td>TEST</td></tr>
</table>
</body>
Rob*_*sto 15
Firefox和Chrome在HTML5中的表格单元格中处理填充的方式显然存在错误:http://code.google.com/p/chromium/issues/detail？ id = 50633
当您尝试使用0填充的标记和CSS时,它们是相同的.当您将DOCTYPE切换为非HTML5时,它们也是相同的.
小智 9
对于HTML5,如果line-height是默认值,某些浏览器会向带有图像的表格单元格添加2px.它被标记为一个错误,不要指望它总是像这样.
table { line-height: 0; }