使用CSS布局实现左侧固定、右侧自适应的布局？

Question

使用CSS布局实现左侧固定、右侧自适应的布局？

7

有没有一种稳定的跨浏览器解决方案，可以实现固定和流体CSS列？我需要左侧的一栏固定，右侧的另一栏流体。

以下是我的代码片段- .promoImg 和 .promoContent 并排浮动。 #recommends 占浏览器宽度的90％， .promoImg 需要固定在120像素，而我希望 .promoContent 可以自适应拉伸。

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

- Dancer

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Samich · Accepted Answer

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

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

附注: 如果promoblock需要在120px处修复，这意味着你的内部div宽度超过了300px。