Question

我写的某些CSS存在一个奇怪的问题。基本上，我有一个固定的边栏，上面带有<hr/>元素，并且在页面加载时可以正确显示-但是，当您向下滚动边栏时，<hr/>元素会消失，直到刷新它为止。

我已一一删除了页面上的所有内容（所有javascript，css等），并且似乎有影响的唯一一段代码是position: fixed-如果我从侧边栏代码中删除了该代码， <hr/>元素似乎工作得很好。

如果他有帮助，您可以看到此on this page。我已经尝试为元素添加宽度，但它似乎并没有停止奇怪的消失行为。任何帮助将不胜感激。

编辑：如果我放置具有相同样式的空<div></div>元素而不是<hr/>元素，这也适用。

如果有帮助，请使用侧边栏样式：

    .menubar {
        background-color: #343a40;
        position: fixed;
        height: 100%;
        overflow-y: auto;
        z-index: 500;
        max-width: 250px!important;
        min-width: 250px!important;
        margin-left: -15px;
        padding: 0 15px 0 15px;
    }

这是<hr/>的样式

    .menubar hr {
        margin-top: 10px!important;
        margin-bottom: 10px!important;
        border: 0!important;
        width: 100%!important;
        height: 1px!important;
        z-index: 50!important;
        background-image: linear-gradient(to right, rgba(248, 249, 250, 0), rgba(248, 249, 250, 0.75), rgba(248, 249, 250, 0))!important;
    }

Answer 1

我已经看过了，您需要添加相对于hr元素的位置，我仍在为您编写代码提供更好的方法，我100％建议您仔细看一下并重构标记的结构。

为什么某些元素在滚动后由于position：fixed似乎消失了？

1 个答案: