保证金:0 自动;似乎在 Chrome/FF 中工作正常,但 IE 再次不同意

发布于 2024-08-07 08:42:29 字数 210 浏览 4 评论 0原文

在我的 Joomla 网站上,我使用的模板使用以下 CSS 规则使内容窗格居中:

clear:both;
margin:0 auto;
width:920px;

这似乎在 FF/Chrome 中工作得很好,但在 IE 中加载时,所有内容都粘在窗口的左侧。这有什么问题吗?保证金:0 自动;这似乎是一个明智、直接的规则。为什么IE不服从呢?

On my Joomla Website, I am using a template which uses the following CSS rule to make the content pane centred:

clear:both;
margin:0 auto;
width:920px;

This seems to work perfectly well in FF/Chrome, but when loaded in IE, all is glued to the left side of the window. What's the issue with this? margin: 0 auto; seems like a sensible, straight-forward rule. Why does IE not obey?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

染柒℉ 2024-08-14 08:42:29

检查你的 DOCTYPE 看起来不是这样的:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!--  --><?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

因为这样,IE 将处于 Quirksmode(无 boxmodel)

Check that your DOCTYPE does not look like this:

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<!--  --><?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

because then, IE will be in Quirksmode (no boxmodel)

动次打次papapa 2024-08-14 08:42:29

另一种选择是使用以下内容:

position:absolute;left:50%;
margin:0 0 0 -460px;
width:920px;

它将 div 置于其父级的中心。

Another option is to use the following:

position:absolute;left:50%;
margin:0 0 0 -460px;
width:920px;

which will center the div in its parent.

沫离伤花 2024-08-14 08:42:29

有时,明确扩展选项可能会有所帮助:

margin-top: 0;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;

Sometimes, it may help to expand the options explicitly:

margin-top: 0;
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文