HTML/CSS：将浮左元素展开为父类的剩余宽度

对于我的生活，我无法弄清楚这一点。我有一个特定宽度的容器div。里面还有一些小孩子。我希望最后一个div扩大其宽度以填充容器中剩余的剩余宽度。我怎样才能做到这一点？HTML/CSS：将浮左元素展开为父类的剩余宽度

下面是一个例子（也是在http://jsfiddle.net/nbKAr/）：

#container { 
 
    width:200px; 
 
    border: 1px solid red; 
 
} 
 
    
 
#container div { 
 
    float:left; 
 
    border: 1px solid black; 
 
}

<div id="container"> 
 
    <div>a</div> 
 
    <div>b</div> 
 
    <div id="expandMe">expand me</div> 
 
</div>

比方说，用 “A” 和 “B” 的div结合起来，50像素的总宽度。如何在不使用JavaScript的情况下制作#expandMe 150px？

来源

2010-09-14 Foobarbis

你知道，所有的元素将其父内不适合包装？ – Larsenal 2010-09-14 23:17:01

-1

不能没有Javascript完成。

您可能会发现一些巧妙的方式来实现外观，但没有可靠的方法来完成您所描述的内容。

来源

2010-09-14 23:12:34 Larsenal

Larsenal是对的，这不能用div来完成。你可以去旧学校并使用一张桌子，或者只是稍微决定一点，并定义宽度。

来源

2010-09-14 23:14:51 jhanifen

如果您将float从最后一项中删除，使用#expandMe，然后将overflow:auto;应用于它，我想您会得到您要的。

overflow: auto;浮动后的元素将导致最后一个元素填充剩余空间。

Here is my sample.

来源

2012-05-27 16:39:58

HTML/CSS：将浮左元素展开为父类的剩余宽度

回答

相关问题