Html 位置绝对元素上的100%宽度

我正在尝试创建一个

div

，使其父元素（

body

）具有100%的宽度

body

有一个水平滚动条，

div

只占视口宽度。为了解决这个问题，我补充道

width: inherit;

去吧。我希望它能工作，因为根据，继承意味着“从父元素获取属性的计算值”。我在一个更简单的模型中测试了它，它可以工作：

然而，当我将代码应用到实际项目中时，它并没有像预期的那样工作。它甚至似乎没有遵循定义

如您所见，

div

将

继承

作为其

宽度

。但它的计算宽度不是其父体的宽度，而是其他值

现在让我们看一看<代码>正文<代码>：

body

的宽度显然是

470px

我不知道这背后的原因是什么，使它不能按预期工作。整体结构与小提琴相同，但结果不同

---

发生这种情况的可能原因是什么？很抱歉，我无法发布代码的相关部分，因为我甚至不知道它导致此问题的位置。

这是因为带有

位置：绝对

的元素位于对

的引用位置，因为

没有位置将其置于引用位置。因此，它也继承了

html

的宽度

要修复它，请将

position:relative

添加到

body

---

您的body标记具有position static（静态位置），为了使position absolute（绝对位置）正常工作，父元素必须将position（位置）设置为relative（相对）或absolute（绝对位置）。

---

只需添加位置：相对或绝对；到body标签。

我尝试在中添加

relative

，但遗憾的是，它仍然不能正常工作。（如果相对于

html

的

div

，以及

html

占据了整个文档的宽度，它不会有相同的效果吗？）