div无法使用固定标头正确定位自身

Question

我有一个带有position:fixed的标题。 此标头中有一个高度可变的div， min-height: 60px

现在，头div下方有一个称为container的div，它具有以下CSS：

width: 1007px;
padding: 60px 0 0 0;
display: block;

现在，只要标头为60px，它就可以正常工作，但是当标头高度增加时，标头会隐藏容器的顶部。 我该如何解决这个问题，以便如果标题的高度动态更改为90px，则容器div将根据此新高度移动到下方？

HTML如下：

<div id="wrapper">
 <header style="width: 100%; display: block; position: fixed; z-index: 1;">
    <div class="b-block" style="min-height:60px;display: block;">blah blah</div>
 </header>
 <div id="container" style="width: 1007px; padding: 60px 0 0 0; display: block;">blah blah</div>
</div>

Answer 1

由于标题具有固定的位置，因此您遇到的是正常现象。 如果标题内容发生更改，唯一实现所需内容的方法是使用javascript动态更改#container的填充。

这是一个示例： http : //codepen.io/seraphzz/pen/milpv

您获得标头的高度并将其设置为#container div的顶部填充。