固定的位置不能在向下滾動的鉻 - 檢查器設備

我認爲這很奇怪，但是，當我使用Chrome工具在檢查器網站上測試我的網站時，我的標頭position:fixed無法正常工作。在所有其他瀏覽器和屏幕尺寸上工作良好。只是在督察網不起作用。固定的位置不能在向下滾動的鉻 - 檢查器設備

.site-header{ display: block;} 
 
.header-top{ 
 
\t background-color: #87b7bb; 
 
\t height: 90px; 
 
\t position: fixed; 
 
\t width: 100%; 
 
\t z-index: 1; 
 
\t \t -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.66); 
 
    -moz-box-shadow: 0px 00px 10px 0px rgba(0,0,0,0.66); 
 
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.66); 
 
} 
 
.block{ 
 
    position:static; 
 
background-color: #000; 
 
    height:1000px; 
 
    width:100%; 
 
}

<div class="site-header" > 
 
\t \t <div class="header-top"> 
 
\t \t </div> 
 
</div><!-- #masthead --> 
 
<div class="block"> 
 
<p> 
 

 
</p> 
 
</div>

當我使用的檢查工具，我可以改變所有的設置和我看到的變化，但固定位置不起作用。

此外，這隻發生在向下滾動。當我向上滾動時，我看到標題以正確的方式在窗口上移動。

有人可以幫助我嗎？

來源

2016-11-17 Marco Romano

請使用上面的[編輯]鏈接添加[MCVE。 –

@JF所以這是一個簡單的例子，但詛咒這項工作。我無法將我的網站的所有代碼放在這裏，也不能在本地放置。 –

您是否試過在您的.header-top上添加top：0？

此外，代替width 100%

你嘗試使用以下

.header-top{ 
    background-color: #87b7bb; 
    height: 90px; 
    position: fixed; 
    left: 0; 
    right: 0; 
    top: 0; 
    z-index: 1; 
    -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.66); 
    -moz-box-shadow: 0px 00px 10px 0px rgba(0,0,0,0.66); 
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.66); 
}

來源

2016-11-17 18:15:27

感謝但仍然無法工作，我認爲這是關於Chrome工具的 –

固定的位置不能在向下滾動的鉻 - 檢查器設備

回答

相關問題