文档流程中的滑块/图像

Question

我试图将我的侧边栏向左移动而我的滑块向右移动，但是我的图像不在文档流程中。

基本上我要做的是当用户调整浏览器窗口大小时，图像会缩小（这就是我使用max-width：100％的原因）。

在Chrome中查看以查看问题

Answer 1

您可以尝试将width : 100%用于主要类，如下所示。

.main {
position: relative;
float: right;
max-width: 600px;
margin: 0;
width: 100%;
}

修改

您已编辑了标记设计。您已在文章div之外添加了新的内容div。

修改

#page-wrap {
max-width: 960px;
min-height: 100%;
height: auto !important;
padding-bottom: 40px;
margin: 0 auto;
position: relative;
}

#sidebar {
position: absolute;
width: 300px;
left: 0;
top: 130px;
}

.content {
max-width: 600px;
position: absolute;
left: 360px;
top: 130px;
right: 0;
}

如果以这种方式更改类，则在调整浏览器大小时，将调整图像大小。

您可以查看有关此问题的简单演示。

http://jsfiddle.net/qCQ9H/2/