IE6 CSS Float Dropdown问题

我正在努力解决IE6浮动问题。（我知道IE6很烂，但我的大公司使用它..）我已经创建了一个简单的标题，正文，页脚布局，内容区域和边栏内的正文。基本上是一个普通的博客布局。IE6 CSS Float Dropdown问题

我那么它下面的两个div并排没有问题，在IE6中，但我试图在顶部创建一个有特色的区域DIV内容区域实现这一目标。它在现代浏览器中看起来不错，但在IE6中它将第二个div放在第一个下面。就像div容器太大，所以它推动第二。但是，这不应该是问题，因为它们都足够小（宽，填充，边距），以适应..

这里是我的代码：

HTML

<body> 
<div id="page-wrap"> 
<div id="header"> 
</div> 

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

<div class="clear"></div> 

<div id="#1"> 
</div> 

<div id="#2"> 
</div> 

</div><!--Content End--> 

<div id="sidebar"> 
</div> 


<div class="clear"></div> 

<div id="footer"> 
</div> 

</div><!--Body Content End--> 
</div><!--Page Wrap End--> 

</body>

CSS

#page-wrap { 
    width: 960px; 
    margin: 0 auto; 
    background-color: #fff; 
} 
#header { 
    width: 954px; 
    height: 50px; 
    padding: 10px 0; 
    margin: 0 3px 2px 3px; 
    border-bottom: #7E7871 dotted 3px; 
} 
#content { 
    float: left; 
    width: 650px; 
    margin: 0; 
    padding: 15px 5px 0 15px; 
} 
#feature { 
    width: 650px; 
    margin: 0; 
} 
#content #1 { 
    border-right: thin solid #CCC; 
    width: 305px; 
    margin: 0; 
    padding: 0; 
    float: left; 
} 
#content #2 { 
    width: 305px; 
    margin: 0; 
    padding: 0; 
    float: right; 
} 
#sidebar { 
    float: right; 
    width: 250px; 
    padding: 0 10px 20px 10px; 
    margin: 0; 
    background: url(../_images/bg_aside.gif) repeat-y; 
}

来源

2012-01-04 Colton45

IE6刚刚被发音死于MS一天前，他们烘烤了一个蛋糕：http://www.theregister.co.uk/2012/01/03/microsoft_ie6_death/ – Jakub 2012-01-04 20:46:47

由于您没有提供太多细节，以如何你的HTML/CSS不会在浏览器中工作，我可以在代码中找到的唯一的错误是你有一个流浪</div>：

<body> 
    <div id="page-wrap"> 
     <div id="header"> 
     </div> 

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

     <div class="clear"></div> 

     <div id="programs"> 
     </div> 

     <div id="discounts"> 
     </div> 

     <div class="clear"></div> 

    --> </div><!-- THIS ONE! --> 

     <div id="sidebar"> 
     </div> 

     <div class="clear"></div> 

     <div id="footer"> 
     </div> 

     </div><!-- Body content end --> 
    </div><!-- Page wrap end --> 
</body>

来源

2012-01-04 20:48:23 Bojangles

对不起，我加入到我的问题更具体并删除额外的div。该div只是写在一个错字。谢谢JamWaffles。 – Colton45 2012-01-04 21:08:09

它的一个下面沾的原因是由于内容是较大比div。

但是，你的CSS不匹配所提供的HTML。没有实际的内容，很难调试其中的一些。

假设＃2和＃1是#discounts和#programs，我建议增加溢出：滚动;看看它是如何变化的。

来源

2012-01-04 22:05:05 ecsos

我已更正了标记。对于那个很抱歉。我给溢出了：滚动一下。它把div放在一起，但有滚动条。 – Colton45 2012-01-04 22:43:55

IE6 CSS Float Dropdown问题

回答

相关问题