gpt4 book ai didi

html - 如何让 div 溢出而不将 IE 中的电子邮件中的其他内容向下推?

转载 作者:太空宇宙 更新时间:2023-11-04 13:24:41 26 4
gpt4 key购买 nike

我试图在电子邮件中放置一个 div,这样它就会溢出后来放置的内联 block div(而不是将它们向下推),因为所讨论的 div 是显示:内联。它似乎在 Chrome 中工作,但我无法让它在 IE 中正确呈现,它被稍后放置的内联 block div 所限制。

这是我正在谈论的示例(所讨论的 div 具有蓝色背景):

<html>
<head>
<style type="text/css">
* {
margin: 0;
padding: 0;
border: 0;
}
div {
*display: inline!important;
_height: 1px;
}
</style>
</head>
<body style="width: 300px; height: 300px;">
<div style="margin: 0; padding: 0; font-size: 1px; display: block!important; width: 300px; height: 300px; background-color: green;">
<div style="margin: 0; padding: 0; font-size: 1px; display: inline-block; width: 300px; height: 10px; background-color: gray;"></div>
<div style="margin: 0; padding: 0; font-size: 1px; display: inline-block; width: 10px; height: 280px; background-color: gray;"></div>
<div style="margin: 0; padding: 0; display: inline-block; width: 280px; height: 280px; background-color: red; line-height: 23px; font-family: Helvetica, Arial, FreeSans, san0serif; color: #333;">
<div style="margin: 0; padding: 0; margin-top: 0; width: 150px; height: 320px; background-color: blue; display: block;"></div>
</div>
<div style="margin: 0; padding: 0; display: inline-block; width: 10px; height: 280px; background-color: gray;"></div>
<div style="margin: 0; padding: 0; display: inline-block; width: 300px; height: 10px; background-color: gray;"></div>
</div>
</body>
</html>

这是它在 Chrome 中的呈现方式(以及我希望它呈现的方式): Correct

这是它在 IE(8) 中的呈现方式:

Incorrect

如何让 IE 像在 Chrome 中一样呈现此 div?

最佳答案

大多数电子邮件客户端不会 100% 始终如一地收听 css。这在某种程度上也适用于 Web 客户端电子邮件 View 。您需要将 2 个 div 与容器对象分离。 IE:两个单独的包含所以当左边的一个溢出时 - 右边的 div 没有。

编辑:这是一个很好的兼容性图:http://www.campaignmonitor.com/css/

关于html - 如何让 div 溢出而不将 IE 中的电子邮件中的其他内容向下推?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/10606746/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com