我的标题位于固定位置，但我遇到了 Disqus 问题。

Question

我的情况： 我有一个不可移动的标题，每当我向下滚动时它都会保持在原位。我在底部的页脚之前有一个 div。该 DIV 包含 Disqus 评论系统。

问题是：

每当我在底部向下滚动时，DIV 都会按预期顺利运行（就在标题下方）但是Disqus 评论系统会超出预期的标题位于标题下方。

div的代码和评论模板的调用函数如下：

<div class="comments-template" style="position:inherit;">
<?php comments_template(); ?>
</div>

DIV和Disqus评论系统的CSS代码如下：

.comments-template{
    width: 1040px;
    position: static;
    margin: auto;
    clear:both;
    background-color:#CCC;

}

#disqus_thread {
    color: #FFF; 
    padding: 5px;
    margin: auto;
    clear:both;
    position:static;
}

.dsq-comment-header {
    background-color: 2d2d2d;
    font-family:"Arial",sans-serif;
    font-size: 12px;
    height: 50px;
    position:static;
    clear:both;
    }

.dsq-comment-message {
    font-family:"Tahoma",sans-serif;
    font-size: 11px;
    color: #333; 

    }
textarea {
    background-image: none;
    background-repeat: repeat;
    border:  #666 2px solid; /* light blue border */

    }
.dsq-comment {
    border: #666 2px solid; /* light blue border */
    margin-bottom: 15px;

    }

希望您能帮我解决我的问题问题。

提前谢谢您！

Answer 1

为您的标头提供更高的 z-index：

header {
  z-index: 5;
}