固定Div正在隐藏Scrollbars

Question

我有一个古怪的问题，我有一个DIV滚动到我的页面内......但是在那个div中我有'标题'是固定的......因为我的布局是流畅的（100％）宽，它正在下面div的滚动条上制作“FXED”div封面....

解决此问题的最佳方法是什么？我附上了一个简单的屏幕截图，希望它有所帮助。

/* BLUE SECTION */    
.floatingHeaderBox {
        width: 100%;
    }

    /* RED BOX BELOW */
    .contentBoxRight{
position:absolute;
width:80%;
left:20%;
height:100%;
background-color:#FFF;
border-left:1px solid #CCC;
margin-left:-1px;
}

.contentBoxRight{ overflow:auto; overflow-x:hidden; }

Answer 1

我认为你可以这样做http://jsfiddle.net/yuliantoadi/bXukG/1/

我没有你的HTML，所以我是靠自己制作的。

Answer 2

如果你的floatingHeaderBox在你的滚动框内，如下所示：

<div class="contentBoxRight">
    <div class="floatingHeaderBox">Hdr</div>
</div>

您可以添加负左边距以考虑滚动条。由于x-overflow设置为隐藏，因此您无法判断它是否已移动。添加填充或子容器以在左侧返回所需的空间。

.floatingHeaderBox {
        width: 100%;
        margin-left:-18px;
    }