< col>宽度和填充 - IE7 [英] <col> width and padding - IE7
问题描述
IE 7将填充添加到列的总宽度。 FF和Chrome包括宽度的填充。如何在各种浏览器之间获得一致性？
IE 7 adds the padding to the total width of the column. FF and Chrome include the padding in the width. How do I get consistency across browsers?
<!DOCTYPE html>
<html>
<head>
<title>Col Padding</title>
<link rel='stylesheet' type='text/css' media='all' href='http://meyerweb.com/eric/tools/css/reset/reset.css' />
<style type='text/css'>
#col1
{
width: 200px;
}
#theTab td
{
background-color: green;
padding: 10px;
}
#theBar
{
width: 200px;
height: 20px;
background-color: blue;
}
</style>
</head>
<body>
<div id='theBar'></div>
<table id='theTab'>
<col id='col1'/>
<tr>
<td>Data</td>
</tr>
</table>
</body>
</html>
推荐答案
IE8及更高版本必须支持，支持使用 <$来覆盖框大小的每个元素的工作原理c $ c> box-sizing CSS属性。
IE8 and later, and everything else you're likely to have to support, support overriding how box sizing works per-element using the box-sizing CSS property.
如果您必须支持IE7，需要 border-box ; IE7将忽略该属性，但是仍然遵循该模型，并且其他一切将匹配IE7的行为。
If you have to support IE7, set the box sizing on whatever you need to border-box; IE7 will ignore the property but follow that model anyway, and everything else will match IE7's behaviour.
也就是说，IE6和更高版本 W3C标准模型在标准模式时。您应该仔细检查您的DOCTYPE等，以确保他们将调用该渲染模式，而不是怪异模式。
That said, IE6 and later should support the W3C standard model when in "standards mode". You should doublecheck your DOCTYPE and such to make sure they'll invoke that rendering mode and not "quirks mode".
这篇关于< col>宽度和填充 - IE7的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
