css - 如何使 div 固定在侧边栏上并且不重叠

Question

我有 2 个 div 喜欢

<div class="container">
example data example data example data ...
</div>

<div class="sidebar"></div>

我喜欢的风格

.container {
    width:300px;
    height:auto;
    margin:auto;
    padding-top:10px;
    background-color:blue;
}
.sidebar {
    height: 150px;
    width: 150px;
    background-color:#ddd;
    position:fixed;
    right:20px;
    top:60px;
}

我希望我的侧边栏已修复，当我缩放不重叠的小宽度窗口时

怎么做谢谢这里是我的例子http://jsfiddle.net/npUaf/

Answer 1

根据您的评论“我认为 div 可以消失”，您可以使用媒体查询：

@media screen and (max-width: 660px) {
    .sidebar {
        display: none;
    }
}

检查您更新的小提琴

Answer 2

.container {
    width:300px;
    height:auto;
    margin-right: 200px;
    float: right;
    padding-top:10px;
    background-color:blue;
    }

将此 css 用于容器。