使用content div作为页面的容器。
.sidebar {
position: fixed;
width: 200px;
height: 400px;
background: #000;
}
.content {
margin-left: 200px;
height: 500px;
width: auto;
position: relative;
background: #f00;
overflow: auto;
z-index: 1;
}
.info {
width: 1440px;
height: 300px;
position: relative;
background: #f55;
}
您的内容将需要成为放置页面的容器。这里的值是我的测试,看看我是否正确。如果您的宽度和高度超过您为内容设置的值,则会显示滚动条。
编辑:响应侧边栏
要有一个敏感的固定侧边栏,只需添加一个媒体查询。
例:
@media (min-width:600px) {
.sidebar {
width: 250px;
}
.content {
margin-left: 250px;
}
}