Html CSS-绝对位置的全宽元素在缩放后被剪切

元素被绝对定位，并使用设置为

0

问题是，当窗口被缩放时，元素仅对视口全宽。下图详细解释了该问题

是否有任何CSS黑客来修复此问题

要测试的JSIDLE：

---

有什么原因不能使用宽度：100%？

您可以执行以下操作：

body {
position:relative;
float:left;
}

#header {
width:100%;
}

---

这将确保

绝对

元素在宽度方向上与

主体

相对（因为其定位为

相对

），

浮动：左

将确保主体与内容一样宽。

hi@Natalia，你应该在评论部分提问，这样你的答案就不会以问题的形式出现。有什么解决方案可以让我获得与演示中相同的输出吗？？