固定定位在Firefox

不工作我已经跟随我的网页HTML，我想保持固定在左side.It侧边栏在Chrome工作正常，但Firfox不显示为固定侧边栏：固定定位在Firefox

<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>

的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); 
}

请建议我一些解决方案，使侧边栏将保持在Firefox中修复。

DOWNVOTERS请先评论。

来源

2013-07-19 vertexion

似乎对我很好。我也会加左：0;到你的css – shammelburg

你能描述一下Firefox中发生了什么？更好的是，制作一个[小提琴]（http://jsfiddle.net）并告诉我们。此外，你可能想尝试添加'left：0;'到'＃sidebar' – Luke

看不到任何错误：http://jsfiddle.net/sH4ZX/ – melancia

检查你的身体css标签，metas，以及任何可能影响该div的东西。也许有另一个css规则覆盖'位置' 另外，如果您在css中有css3标记或错误，例如transform: translate3d(0px, 0px, 0px);可能会导致Firefox中的固定位置中断。

来源

2013-11-27 17:12:30 Jorge

这正是我的问题。谢谢！ –

我也遇到了''backface-visiblity：''隐藏的问题，导致所有'position：fixed'元素都被破坏。删除解决了Firefox中的问题。 – shshaw

@shshaw的背景知名度+1。即使我不知道它为什么会起作用，但是你拯救了我的生命。 ;） –

我想你应该尝试做一些改变你的CSS 试试这个CSS

#sidebar 
{ 
    position: fixed; 
    top: 0; 
    padding: 10px; 
    bottom:0; 
    left:0; 
    width:200px; 
    background: #364050 ; 
    box-shadow: inset -0.1em 0em 0.35em 0em rgba(0,0,0,0.15); 
}

我不喜欢使用EM为元素的尺寸应该在PX可以使用EM敌我字号等等

来源

2013-07-19 08:26:21

#sidebar 
{ 
    position: fixed; 
    top: 0; 
    left: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); 
}

来源

2013-07-19 08:27:48 shammelburg

如果你的问题是过滤器（而不是转换）导致问题，那么这将工作。

我在固定元素父级上有一个过滤器设置，但它随着窗口的宽度而改变。我注意到，当窗口宽度越过这些@media (max-width...)边界时，固定位置元素将重新定位到它应该处于的位置，而不管过滤器具有什么。

原单码：

<style> 
    .withFilter { 
    filter: whatever; 
    } 
    #fixed { 
    position: fixed; 
    bottom: 0px; 
    .... 
    } 
</style> 
<body> 
    <div id="a"> 
    <div id="fixed"> 
     at bottom 
    </div> 
    </div> 
    <script> 
    ... lots of stuff ... 
     jQuery("#a").addClass('withFilter'); 
    ... lots of stuff ... 
    </script> 
</body>

工作代码：

.... same stuff .... 
    <script> 
    ... lots of stuff ... 
     setTimeout(function() { 
     jQuery("#a").addClass('withFilter'); 
     }); 
    ... lots of stuff ... 
    </script> 
</body>

只是足够的时间增加对固定位置向扎根后，才应用过滤器/转换....

来源

2015-09-03 18:06:01 user3338098

固定定位在Firefox

回答

相关问题