Css 位置：固定不工作在铬无论什么

我目前在Sass中有一个导航和一个向下滑动的社交菜单，两者都是固定的

然而，当我向下滚动时，Chrome中什么也没有发生。在Safari中，它确实起作用

我在谷歌上搜索了很多次，甚至当我使用

-webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0);
-webkit-transform: translate3d(0, 0, 0);

它仍然不起作用

这是我的社交菜单的css代码，里面有一个ul和一个li

.social-menu{
    position:fixed;
    top: 0;
    bottom:0;
    width:100%;
    height:100vh;
    z-index:10000;
    -webkit-backface-visibility: hidden;
-webkit-transform: translateZ(0);
-webkit-transform: translate3d(0, 0, 0);

    background-color:rgba(123, 123, 123, 0.86);

    .social-list{
        width:50%;
        margin:0 auto;
        .social-list-item{
            list-style-type: none;
        }
    }
}

这是我的JSFIDLE，我的社交菜单嵌套在我的身体里。在这里，它的工作，也许尝试自己在铬

此外，我还利用

如果从主体中删除变换样式：preserve-3d和-webkit变换：translateZ0；从容器中。它可以工作。在你的房间里试试

我假设这些变换正确地影响了导航在z轴上的位置

body {
    margin: 0;
    padding: 0;
    height: 100%;
    min-height: 100%;
    /* -webkit-transform-style: preserve-3d; */
    /* transform-style: preserve-3d; */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.container {
    width: 100%;
    background-color: #f1f1f1;
    /* -webkit-transform: translateZ(0); */
}

如果从主体中删除变换样式：preserve-3d和-webkit变换：translateZ0；从容器中。它可以工作。在你的房间里试试

我假设这些变换正确地影响了导航在z轴上的位置

body {
    margin: 0;
    padding: 0;
    height: 100%;
    min-height: 100%;
    /* -webkit-transform-style: preserve-3d; */
    /* transform-style: preserve-3d; */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.container {
    width: 100%;
    background-color: #f1f1f1;
    /* -webkit-transform: translateZ(0); */
}

---

尝试在社交菜单的容器中提供transform:inherit。

---

我尝试了这个方法，它对我很有用，因为我在chrome中的container元素在dev tools的computed css中添加了transform:none。

尝试在社交菜单的container中给出transform:inherit。

---

我尝试了这一点，它对我起了作用，因为我在chrome中的container元素添加了transform:none在dev tools的computed css中。

它看起来已经修复了！检查你的小提琴。。！它甚至在我的机器上也能工作在你的机器上将机身边距设置为0css@Deepak我知道，我说过它在我的小提琴里起作用。但在我的网站上没有：。@AndrewBone我的身体上已经设置了0的边距和填充。@FabianTjoeAOn然后提供一个到你网站的链接。它看起来已经修复了！检查你的小提琴。。！它甚至在我的机器上也能工作在你的机器上将机身边距设置为0css@Deepak我知道，我说过它在我的小提琴里起作用。但在我的网站上它没有：。@AndrewBone我的身体上已经设置了0的边距和填充。@FabianTjoeAOn然后提供一个到你网站的链接。哇，多谢了，伙计，它终于起作用了。这是罪魁祸首！哇，非常感谢，伙计，它终于起作用了。这是罪魁祸首！