css宽度%工作不正确；超过必要的时间

我有一组图像，我希望一个叠在另一个上面。我正在使用bootstrap，我在jumbotron的中心保留了一个父div。这个div包含一个图像，绝对是包含图像的div。但是，当我将

width:100%

应用于子div时，它们最终会变长/

此js小提琴是代码片段：

我相信%实际上是相对于父容器来度量的（

#示例中的major

）。因此，我的

#半音

的宽度和高度应该相等，因为

#半音

的宽度和高度相等

在检查实际尺寸时，我发现

#major

父项的整个宽度用于计算

#semimajor

或

#major

的宽度是用边距计算的。我的

框大小调整

属性设置为

边框框

应该发生的是，

#半音

应该测量150px乘以150px。但我无法发现代码中的错误

---

编辑1:

position:relative

on

#major

删除了该问题，但我仍然不明白为什么会出现这种情况。

当您使用

position:absolute

时，它来自文档的正常流程，相对于

body

定位，并且来自

#major

---

请注意，当您添加了

位置：relative

时，它绝对定位到最近的相对定位父容器，即

#major

，因此子div不会超过

#major
位置：relative
为绝对定位的元素定义一个新的祖先包含块
#semimajor
设置为
位置：绝对值
，因此如果没有相对定位的元素父元素，它最接近的祖先包含块将是文档本身。为什么您会回答这样的问题，而不投票作为简单错误关闭？这在堆栈溢出之前已经讨论过很多次，在其当前状态下，对很多用户都没有用处。你只是在重复评论中发布的信息。如果有什么比这更好的解释，请检查回答和评论的时间。我肯定我们是在同一时间打字的。我没有注意到评论被发布。你的答案在我发表评论后整整一分钟就被发布了，你还没有解释为什么你会回答一个简单的错误问题，而不是投票结束。关键是让roombaEdit 1:position:relative on#major删除了这个问题，但我还是不明白为什么会这样。好的，但这仍然不能解释为什么你选择回答一个简单的错误问题，而不是在评论中提供非常少量的相关信息，然后投票结束。