css - 为什么 position fixed div 会跑到主容器外面？

Question

下面给出了固定的 div CSS:

.top-container {
position: fixed;
width: 100%;
z-index: 999;
}

当我缩小屏幕时，此 div 破坏了右侧的主容器，但左侧没问题。查看下面的屏幕截图以便更好地理解。

Answer 1

您必须了解position: fixed; 是如何工作的。它忽略任何周围的元素。

您可以找到详细信息here .

引用一段话:

A fixed position element is positioned relative to the viewport, or the browser window itself.

更新
您可以尝试使用与左侧元素宽度相同的 margin-left 和与 .top-container 右侧元素宽度相同的 margin-right 元素。这显然不是一个理想的解决方案，但可以解决您的问题。