你如何制作一个 100% 的 div - 一些像素？ [复制]答案

【问题标题】：How do you make a div 100% - some px? [duplicate]你如何制作一个 100% 的 div - 一些像素？ [复制]
【发布时间】：2013-05-27 12:33:01
【问题描述】：

我有两个 div。我希望左边的那个是 200px。我希望右边的那个能填满屏幕宽度——200px。换句话说，右边的 div 在左边的 div 被绘制之后应该是 100% 的可用空间。有没有一种纯粹的 css 方式来做到这一点？

rough example

<div class='l'></div><div class='r'></div>
.l {
    display:inline-block;
    background:green;
    width:100px;
    height:20px;
}

.r {
    background:red;
    height:20px;
}

【问题讨论】：

jsfiddle.net/UrubG

标签： css

【解决方案1】：

Working jsFiddle Demo

考虑以下标记：

<div id="fixed">Fixed Width</div>
<div id="flexible">Flexible Width</div>

在你的 CSS 中：

#fixed {
    background: red;
    float: left;
    width: 200px;
}

#flexible {
    margin-left: 200px;
    background: green;
}

【讨论】：