固定定位在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

回答

相關問題