css – 用左div填充剩余空间

任何人都可以告诉我如何使左div填充剩余的空间,而不修复正确的div大小.

我想要与以下示例完全相反：

.left {float: left; border: 1px solid blue;}
.right {overflow: hidden; border: 1px solid blue;}

正确的div应该只需要它所需的大小,左边的div应该占用所有剩余的空间.

解决方法

具有固定宽度的右侧div必须浮动：右侧;那么左边的div必须保持不变,所以它可以占用它的全部可用宽度,但是既然你想要修正正确的div,你必须先放置它.

HTML：

<div id="parentDiv">
    <div id="rightFixedDiv"></div>
     <div id="leftDynamicDiv></div>
</div>

CSS：

#rightFixedDiv
{
   float:right; 
   border-style:solid; 
   width:100px; 
   height:200px;
}
#leftDynamicDiv
{
   border-style:solid; 
   background-color:blue; 
   overflow:hidden; 
   height:200px;
}

检查出来,固定宽度为100px：http://jsfiddle.net/dkGbd/
固定宽度为200px：http://jsfiddle.net/eESTZ/

现在,如果你想要相反,先将左边的div放在第一位,给它一个浮点数：left;

工作范例：
http://jsfiddle.net/UShek/

原文地址：https://www.jb51.cc/css/215525.html