固定的位置不能在向下滚动的铬 - 检查器设备

我认为这很奇怪，但是，当我使用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工具的 –

固定的位置不能在向下滚动的铬 - 检查器设备

回答

相关问题