CSS`位置：固定`不在滚动上移动

Question

我试图设置一个位置：固定在div“.ais-search-header”上，但在滚动时它不会移动。我也尝试将它从父div中拖出来，但仍然无效。

网址：https://kickegg0.myshopify.com/search.searchdata?q=q 通过：推特

Answer 1

position: fixed元素与其父容器没有依赖关系。它的位置实际上取决于浏览器窗口。这意味着它不会移动或滚动页面滚动。它将位于页面顶部。但是那个元素下的那些将根据页面滚动。如果你想根据滚动移动容器，请给它position: absolute，如： -

#parent {
    position: relative;
}
#container {
    position: absolute;
}

这样它就会在容器内，并会在页面滚动上移动。

Answer 2

Chrome和Firefox中存在一个错误，当存在具有position: fixed或transform属性（或其等效于Webkit的属性）的祖先元素时，backface-visibility相对于屏幕的位置不正确设置。

使用这些属性将要绝对定位的元素移动到元素上方。

Answer 3

位置'固定'定位基于您的浏览器窗口，因此不能随着滚动而移动。如果你想使用滚动使用位置'绝对'