文章/答案/技术大牛

发布

社区首页 >问答首页 >根据IE的“边缘”自动应用单元格间距或填充。

问根据IE的“边缘”自动应用单元格间距或填充。
EN

Stack Overflow用户

提问于 2016-01-21 09:16:02

回答 1查看 29关注 0票数 0

O为IE7提供了一个用于将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>

这就是多边形填充所生成的内容：

<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 of 20px，但是它返回的是auto.于是padding-left变成了auto。

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

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

注意：--我可以看出，这两者的工作方式与这里所指定的完全相同，而且它们中的任何一个都不是bug。我的问题是，按照指定的方式工作对这个特定的用例没有帮助。

不管我多么想抛弃IE7.即使是IE8，承包商也希望我们再支持它几年。

html

css

internet-explorer

internet-explorer-7

回答 1

Stack Overflow用户

发布于 2016-01-21 10:34:19

这个有用吗？

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>

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/34919542

复制

相似问题

问根据IE的“边缘”自动应用单元格间距或填充。
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问根据IE的“边缘”自动应用单元格间距或填充。EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问根据IE的“边缘”自动应用单元格间距或填充。
EN