如何将CSS列扩展到可用空间?

时间:2011-10-09 02:32:53

标签: css sass css-float compass-sass

There is a way to do it using absolute positioning.

我有两列布局。左列是固定的200px宽度加上30px的左边距。右列包含内容,应扩展以适合可用空间。

我已经通过使用绝对位置定位每列并使用右侧拉伸右列来完成它:0px它将触及右边缘。有没有办法在使用float时实现相同的效果:left来定义列?到目前为止,该列只是扩展以适应其内容的宽度。

如果我可以使用Compass / Sass(但我不想依赖Blueprint这样的框架,因为布局非常简单),可以获得奖励积分。

1 个答案:

答案 0 :(得分:3)

@Art;你必须这样写:

HTML:

<div class="left">left fix width</div>
<div class="right">right no fix width</div>

CSS:

.left{float:left;width:200px;margin-right:30px}
.right{overflow:hidden}

检查小提琴http://jsfiddle.net/sandeep/4RN2j/