左列固定和右列流体的CSS布局？

Question

是否有针对固定和流畅CSS列的可靠的跨浏览器解决方案？我需要在左侧固定一个柱子,在右侧固定另一个柱子.

下面是我的代码片段 - .promoImg并且.promoContent彼此并排浮动.#recommends是浏览器宽度的90%,.promoImg需要修复为120px,我想要.promoContent拉伸流体.

<div class="promoBlock ">
    <div class="promoImg">
        fixed content 300px
    </div>
    <div class="promoContent">
        fluid content
    </div>   
</div>

Answer 1

.promoBlock { width:90%; margin:auto; } 
.promoImg { width:300px; float:left; background-color:red; }
.promoContent { margin-left:300px; background-color:green; }

代码:http://jsfiddle.net/P4RBj/

PS:没有得到promoblock需要修复120px.如果是这样,你的内部div更宽(300px).