html - 固定 div 的右侧溢出其父级

Question

我试图将一个 position:fixed div 放入另一个 div 中。我想要一个具有 width:100%; 的固定 div，因此它同时适用于移动设备和桌面设备。

这是我的 JSfiddle

SF 想要一些代码:

<div id="container">
  <div id="item">This div is good div</div>
  <div id="fixed">Right side of this div overflow its parent!!! </div>
</div>

Answer 1

具有 position:fixed; 的元素会忽略父级大小，因为它仅相对于视口(viewport):

MDN:

Fixed positioning is similar to absolute positioning, with the exception that the element's containing block is the viewport.

你可以:

1. 尝试为其指定 position:absolute; 并将容器设置为 position:relative;。

2. 使用position:fixed;并显式设置大小。