gpt4 book ai didi

css - margin auto + float right 在 IE7 中不起作用

转载 作者:行者123 更新时间:2023-12-02 05:09:21 25 4
gpt4 key购买 nike

在 IE7 中呈现时,我在 HTML 中遇到问题。
将“margin:auto” block 与“float:right” block 组合在一起时。

这是此问题的示例代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<div id="floating" style="float: right; background-color: #ccf">
This is the top right links block
</div>
<div id="body" style="width: 800px; margin: auto; background-color: #fcc">
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
</div>
</body>

IE7 中这段代码的问题:

  • margin:auto 没有使 block “body”居中。看起来“ float ” block 以某种方式影响了居中

我在 IE7 中得到的:

div "body" is not centered

正确的显示将是(div "body"居中):

div "body" correctly centered

  • “漂浮” block 在折叠时实际上并没有漂浮在 body 上

我在 IE7 中得到的:

div "floating" do not float

正确显示:

div "floating" correctly floating

有人遇到过这种问题吗?
有什么提示可以在 IE7 上正确使用吗?

谢谢

最佳答案

将两个 div 包裹在一个包含的 div 中。给 wrapper 宽度:100%;或者你想要的任何总宽度。所以你的代码应该是这样的:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
</head>
<body>
<div id="wrapper" style="width: 100%;">
<div id="body" style="width: 800px; margin: auto; background-color: #fcc">

/*---- Moved element ---- */
<div id="floating" style="float: right; background-color: #ccf">
This is the top right links block
</div>
/*---- End Moved element ---- */

This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
This is the body.
</div>
</div>
</body>
</html>

我不太明白,但您可以将其包裹在一个 div 中,或者为 body 标签指定 100% 的宽度或您想要的任何大小。通常最好将 body 标签的宽度设置为 100%,然后设置一个包装 div 来设置框的宽度。

关于css - margin auto + float right 在 IE7 中不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7401481/

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