你如何讓一個div 100％ - 一些px？

Question

我有兩個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; 
} 

Answer 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; 
}