如何调整两个 Div，一个具有固定宽度，另一个占用剩余空间
使用两个 div 容器时，其中一个需要特定的宽度，而另一个应该动态占用剩余空间，有几种方法可以实现这种布局。让我们探索两种方法：
使用显示：表格或表格单元格
通过此方法，我们使用 CSS 显示属性来创建类似表格的结构：
<code class="html"><div class="right"></div> <div class="left"></div></code>
<code class="css">.right {
float: right;
width: 250px;
display: table-cell;
vertical-align: middle;
height: 100%;
}
.left {
display: table-cell;
vertical-align: middle;
overflow: hidden;
}</code>在这种情况下，“右”div 的固定宽度为 250px，而“左”div 由于其“overflow：hidden”属性而占用剩余空间。
使用浮动和百分比宽度
另一种方法涉及使用CSS浮动属性并将div的宽度设置为百分比：
<code class="html"><div class="right"></div> <div class="left"></div></code>
<code class="css">.left {
float: left;
width: 83%;
min-height: 50px;
margin-right: 10px;
}
.right {
float: right;
width: 16%;
min-height: 50px;
height: 100%;
}</code>这里，“左”div 占据了 83% 的可用宽度，为“右”div 留下了 16% 的固定宽度。
示例演示
检查在 JSFiddle 上进行以下现场演示，以查看这些方法的实际效果：http://jsfiddle.net/SpSjL/
以上是如何让div占据固定宽度div后的剩余空间？的详细内容。更多信息请关注PHP中文网其他相关文章！
