O 有一个用于 IE7 的 polyfill 可以转换 display:table进入实际表格，我正在使用 IE7.js (IE9.js 文件)。
两者都工作得很好，而且都做得很好，让我们的开发人员可以减少对 IE7 的思考。
这就是我所拥有的(主表和 IE7 特定表的连接):
/*IE7*/
.sideBySide{
display:table;
}
.sideBySide > *{
display:table-cell;
}
/*MAIN*/
.A{
margin-left: 20px;
}
<li>
<div class="sideBySide">
<img class="img" src="img">
<div class="sideBySide">
<div class="A">Info A</div>
<div class="A">Info B</div>
</div>
<div>OK</div>
</div>
</li>
这是 polyfill 生成的内容:
<style>
........ .A{
/* CSS that overrides and invalidates what was set for A */
}
.newClassA{
margin-left: 20px;
}
.newClassA > /*etc*/{
/* All properties relative to class A */
}
</style>
<li>
<div class="sideBySide">
<img class="img" src="img">
<table>
<tbody>
<tr>
<td class="newClassA">Info A</td>
<td class="newClassA">Info B</td>
</tr>
</tbody>
</table>
<div>OK</div>
</div>
</li>
<style>标签被放置在 <head> 中的最后一个.
为了解决这个问题，我做了这个:
.sideBySide > * > * > td{
padding-left: expression(this.currentStyle['marginLeft']);
}
不幸的是，它没有用。尽管 CSS 明确规定它的 marginLeft 应该为 20px。 ，相反，它返回 auto ...所以padding-left变成 auto .
有没有办法无缝地填充它？这里没有人介意它是否需要大量计算，只要浏览器不会因此挂起即可。
我想让它遵循的一个主要事情是，这应该是可重复使用的部分。如果我在其他浏览器的样式表或内联中设置 CSS，IE7 也必须遵循它。
注意:
我可以看出这两个完全按照此处指定的方式工作，这不是它们中任何一个的错误。我的问题是，按规定工作对这个特定用例没有帮助。
无论我多么想放弃 IE7...甚至 IE8，承包商都希望我们再支持它几年。
最佳答案
这会有帮助吗？
CSS
.sideBySide table {
border-collapse:separate;
}
html
<div class="sideBySide">
<img class="img" src="img">
<table>
<tbody>
<tr>
<td class="newClassA">Info A</td>
<td class="newClassA">Info B</td>
</tr>
</tbody>
</table>
<div>OK</div>
</div>
关于html - 根据 IE 给出的 "margin"自动应用单元格间距或填充，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/34919542/