0

我在 IE7 中测试我的网站时遇到了问题。我有 2 个容器，它们应该彼此相邻漂浮。它在现代网络浏览器中运行良好，但在旧版本的 IE 中，右侧容器被推到左侧容器下方。任何人都可以看到问题吗？主容器设置为 1000px 宽度。这是有问题的 2 个 div 的代码：

#content {
    width: 725px;
    float: left;
    margin: 0 25px 25px 0;
    clear: both;
}

#SideBar {
    width: 225px;
    min-height: 500px;
    float: left;
    margin: 0 0 50px 25px;
}

    #SideBar img {
        display: table;
        margin: 20px auto 0 auto;
        border: 0;
    }

这是html：

<div id="PageWrapper">
<nav id="MainMenu">
</nav>
<header id="Header">
</header>
<section id="PageSlider">

<div id="content">

</div>
</section>
<aside id="SideBar">

</aside>
</div>

你可以看看ashbaines.com的网站

该网站适用于识别 html5 标签。

谢谢

4

2 回答 2

0

在较旧的 IE 版本中存在一个边距较大的错误。尝试将浮动元素设置为“display: inline;”

以下是有关此错误的一些信息： http://www.positioniseverything.net/explorer/floatIndent.html http://www.positioniseverything.net/explorer/doubled-margin.html

于 2013-10-22T12:13:21.737 回答
0

首先更改您的代码，因为您使用诸如, ,之类的html5标签，并且ie7、ie8 等旧浏览器不支持该标签。所以我建议更改您的代码，然后尝试。navheadersectionaside

看看这段代码

<div id="PageWrapper">
  <div id="MainMenu">

  </div>
  <div id="Header">

  </div>
  <div id="PageSlider">
     <div id="content">

      </div>
  </div>
  <div id="SideBar">

  </div>
</div>
于 2013-10-22T12:13:52.017 回答