Question

我正在处理脚本标题修复并修复了我想要使用的右侧滚动条，就像Facebook一样。但我希望右侧的div不被修复。我是固定的职位。 div这次向左移动。

我希望将其修复为黑色div.Header的右侧，其中height: 40px;

中的演示

这是我的 HTML CODE ：

<div class="globalHeader"><div class="globalHader-in"></div></div>
<div class="global_container"><div class="container">
    <div class="ksmsl"></div>
    <div class="ksmort"></div>
    <div class="ksmsg"></div>


</div></div>

以及 CSS代码：

body{
   margin:0px;
    padding:0px;

}
.globalHeader {
    width:100%;
    height:40px;
    position:fixed;
    background-color:#2a3542;
    z-index:99999;
    }
.globalheader-in {
    width:981px;
    height:40px;
    margin-left:auto;
    margin-right:auto;
    border-right:1px solid #fff;
    border-left:1px solid #fff;
    }
.global_container{
    clear:both;
    width:981px;
    height: 100000px;
    margin-left:auto;
    margin-right:auto;
    overflow:hidden;
    position:relative;
    top:40px;
    background-color:#f8f8f8;
    }
.container{
    float:left;
    width:981px;
    height:auto;

    }
.ksmsl{
    float:left;
    width:220px;
    height:auto;
    border-radius:5px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    -o-border-radius:5px;

    }
.ksmsg{
    float:right;
    width:199px;
    height:1000px;

    background-color:#000;
    }
.ksmort{
    float:left;
    width:560px;
    height:auto;
    border-left:1px solid #d8dbdf;
    border-right:1px solid #d8dbdf;
    border-bottom:1px solid #d8dbdf;
    }

Answer 1

修正你的侧边栏，而不是右边浮动，你说对了：0; JS Fiddle

.ksmsg{
    margin-top: 40px;
    position: fixed;
    right: 0;
    width:199px;
    height:1000px;
    color: #fff;
    background-color:#000;
    }

至于将固定边栏保持在容器内，您不能包含固定的div。请参阅：Fixed position div not staying contained in wrapping div, overlays entire screen?

固定标题和固定右滚动条

1 个答案: