Question

我的网页在Firefox中完美运行。但在IE中它没有正确包装。

两列的父母div是：

.underbars
{
    left:0;
    right:0;
    top: 140px;
    position: absolute;    
}

在这个div中有2个div，一个是浮动的，另一个应该直接坐在浮动div的右边。第二个div不浮动的原因是因为我希望它占据空间的左边。在IE中，第二个div直接位于第一个div下。

浮动div :(应该在左侧）

.cabinetpane
{

    border-right: 1px solid #c1c0c1;
    border-right-style: solid;
    border-bottom-style: solid;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-right-color: #c1c0c1;
    border-bottom-color: #c1c0c1;    
    font-size: 12px;
    color: #3B4F65;
}

包装div（应该直接在右侧并占用所有可用空间）

<div> </div> //No css for this one

Answer 1

我能想出的最佳解决方案是拥有一个div，它具有对齐事物的唯一目的（它仅用于结构，不显示颜色/边框）。

这是盒子型号： enter image description here

我正在谈论的是你想要“占据空间左侧”的那个人，也就是橙色的盒子。在div内部应用了一个样式，div将有一个margin-left（这个边距应该与你的float-left列一样宽），这样当另一个div放在里面并且给定宽度：100％时，这种情况下蓝色div（我给它90因为填充和边框等你需要根据你的边框/边距/填充来摆弄它）蓝色div将总是占据空间的其余部分。

按颜色总结：

黑色=您的左栏div已修复
橙色=用于结构的div（不应该有边框/背景等）。
贪婪=橙色div上使用的左边距的隐喻表示
blue =填充右侧空间的div。

P.S。我在IE8中对此进行了测试

你可以找到所有的css / html in this jsfiddle，并且每次发布CSS / js / HTML相关问题时我都会使用JSFIDDLE推荐一张图片描绘1000字。

Answer 2

如果你想要的是Lyuben Todorov所说的话，那样的话会起作用：

<style>
.col1 { width:250px; float:left }
</style>

<div class="col1">
I'm 250
</div>
<div class="col2">
I'm as long as you want me to be, just don't define me! 
</div>

...如果这就是我认为你现在正在讨论的话

IE没有环绕浮动div，但FF是

2 个答案: