gpt4 book ai didi

html - IE 中带有边距的 div 宽度与 Firefox 不同

转载 作者:行者123 更新时间:2023-11-28 03:34:53 25 4
gpt4 key购买 nike

我正在开发一个用户控件,它向服务器执行异步发布。我希望用户控件在工作时淡出并显示“正在发送...”消息和 gif。为此,我试图将一个半透明的 div 绝对定位在控件的主 div 之上。事实证明它比应该的要难得多。我终于让它在 firefox 中看起来不错,但进入 IE 并发现控件的主 div 甚至不是正确的宽度。

我希望总宽度为 275 像素。所以在 firefox 中,我将它的样式设置为

width: 245px; margin 36px 15px 46px 15px;

所以宽度 + 边距 = 275,这就是它的呈现方式。在 IE 中,浏览器从宽度中减去边距,因此总宽度为 245,其中包含 15px 边距。好吧,我发现这两个浏览器都在怪癖模式下运行,尽管......我认为......文档类型是:

<!DOCTYPE HTML PUBLIC -//W3C//DTD HTML 4.01 Transitional//EN>

我的理解是这就是 quirks 模式应该做的,但是当 IE 和 Firefox 以不同的方式呈现它时,即使它们都处于 quirks 模式,我也不知道该怎么做。

最佳答案

如果你发布一个链接会更容易回复,但如果我的假设是正确的,你可以通过使用看起来像这样的元标记来强制 IE 模式

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

显然,根据您要使用的版本,它会有所不同。同样,您可以强制退出兼容模式,进入怪癖模式等。我在 Firefox 中从未遇到过这个问题,所以不能说,但我想 Mozilla 也有类似的东西。

不过,我认为通过设置盒子模型可以更好地解决您的问题。在有问题的 block 元素上使用这个 CSS 类

#yourdiv { box-sizing: border-box }

这将有助于减轻不同浏览器渲染盒模型的痛苦。更多关于盒子尺寸的信息 here .

此外,不要忘记 display: block,因为有时这会解决奇怪的问题。

关于html - IE 中带有边距的 div 宽度与 Firefox 不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15075007/

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