css – HTML5表单元格填充 – 浏览器不同

前端之家收集整理的这篇文章主要介绍了css – HTML5表单元格填充 – 浏览器不同前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我把这个打破了一个简单的例子。

对于我来说,它在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>

解决方法

Firefox和Chrome在HTML5中的表格单元格中处理填充的方式显然有一个错误
http://code.google.com/p/chromium/issues/detail?id=50633

当您尝试使用0填充的标记和CSS时,它们是一样的。当您将DOCTYPE切换为HTML5时,它们也是一样的。

原文链接:https://www.f2er.com/css/218431.html

猜你在找的CSS相关文章