responsive-design - 如何在响应式网页设计中混合固定宽度和百分比宽度？

Question

我有一个简单的网页，它由两列组成：侧边栏和内容。如果两列都是动态的，但侧边栏的宽度必须是固定的，并且内容宽度应该是动态的，取决于浏览器的宽度，这没有问题。

我不知道如何计算列的宽度。

谢谢。

Answer 1

你可以这样做：

小提琴

#sidebar { 
    width: 200px;
    float: left;
}

#content {
    overflow: auto; 
 /* trigger a block formatting context (this fills remaining horizontal width) */
}

Answer 2

我想你正在寻找这样的东西：

http://jsfiddle.net/ekVJe/

我所做的是将侧边栏向左浮动，然后给内容一个与侧边栏宽度相等的左边距：

#sidebar { 
    width: 200px;
    float: left;
}

#content {
    margin-left: 200px;
}