html - 定位固定的 div 以粘在父级内部

Question

我的代码是这样的，

HTML

<div class="container">
    <div class="button"></div>
</div>

CSS

.container { position: relative; }
.button { position: fixed; top: 0; right: 0;  }

这是一个响应式页面，容器的宽度在调整窗口大小时动态变化。即使页面正在滚动，我也想将 .button 粘贴在右上角的容器内。但是我的代码在屏幕右上角的 .container 之外显示了 .button。

请帮我解决这个问题。

感谢和问候。

Answer 1

你应该为此使用position: absolute。

.container { position: relative; }
.button { position: absolute; top: 0; right: 0; }

JSFiddle example .

position: fixed 定位在窗口上，而不是父窗口上。