Question

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清楚地表明它应该有{@ 1}}的marginLeft，而是返回20px ...所以auto变为padding-left。

有没有办法无缝地填充这个？只要浏览器因为它而没有挂起，这里没有人会想到它是否需要大量的计算。

我想要遵循的一个主要内容是，这应该是可重复使用的部分。如果我在样式表中设置CSS或为其他浏览器设置内联，IE7也必须遵循它。

注意： 我可以说这两个完全按照这里指定的方式工作，并且它们不是任何错误。我的问题是按指定的方式工作对这个特定的用例没有帮助无论我想放弃IE7多少......甚至IE8，承包商都希望我们支持它多年。

Answer 1

这会有帮助吗？

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>

应用根据为IE

1 个答案: