固定定位在Firefox中不起作用

ver*_*ion 6 css firefox positioning

我在我的网页中有以下HTML,我希望将侧边栏固定在左侧.它在Chrome中工作正常,但Firfox没有将侧边栏显示为固定:

<div id="sidebar">
    <!-- Logo -->
        <div >
            <h1>Heading</h1>
        </div>
            <!-- Nav -->
                <nav id="nav">
                    <ul>
                        <li><a href="#target1" >About</a></li>
                        <li><a href="#target2" >Works</a></li>
                        <li><a href="#target3" >Our Team</a></li>
                        <li><a href="#target4" >Contact</a></li>

                    </ul>
                </nav>

</div>
Run Code Online (Sandbox Code Playgroud)

上面代码的CSS是:


#sidebar
{
    position: fixed;
    top: 0;
    padding: 3em 1.35em 1em 1.15em;
    height: 100%;
    width: 12em; 
    background: #364050 ;
    box-shadow: inset -0.1em 0em 0.35em 0em rgba(0,0,0,0.15);
}
Run Code Online (Sandbox Code Playgroud)

请给我一些解决方案,以便侧边栏在Firefox中保持固定.

DOWNVOTERS请先评论.

Jor*_*rge 7

检查你的身体css标签,metas,以及任何可能影响该div的东西.也许还有另一个css规则覆盖'position'而且,例如,如果你在body css中有css3标签或错误,transform: translate3d(0px, 0px, 0px);那么可能会在Firefox中产生固定的位置中断.

  • 我在`<body>`上也遇到了`backface-visiblity:hidden`的问题,导致所有`position:fixed`元素被打破.删除它修复了Firefox中的问题. (3认同)
  • 似乎css`filter:...`也会导致`position:fixed`不能在firefox上运行... (3认同)