具有一个固定宽度列和另一个100％宽度的CSS

Question

我有一个布局要求，右列需要固定宽度，左列应该跨越任何可用宽度。

据我所知，我可以从左列删除宽度和浮动，这应该使它占用整个可用空间。

这里是我有什么

<div style="height:300px;border:1px solid red;padding:10px;"> 
    <div style="height:200px;border:1px solid red;margin-right:150px;"> 
     this should take all width 
    </div> 
    <div style="height:200px;border:1px solid green;float:right;width:120px;"> 
     this is right bar with fixed width 
    </div>  
</div> 

任何想法？

Answer 1

你的代码是正确的。与display: table-***这里

<div style="height:300px;border:1px solid red;padding:10px;"> 
    <div style="height:200px;border:1px solid green;float:right;width:120px;"> 
     this is right bar with fixed width 
    </div> 
    <div style="height:200px;border:1px solid red;margin-right:150px;"> 
     this should take all width 
    </div> 
</div> 

http://jsfiddle.net/wwEQb/

Answer 2

共舞：刚上来移动浮动元素 http://jsfiddle.net/EXNvF/