Javascript 相对容器中绝对定位的图像不随容器移动

我有这样的html

<div>
  <div>
    <input class="button"></input>
  </div>
  <div class="father'>
     <img class="img1"></img>
     <img class="img2"></img>
     <img class="img2"></img>
  </div>
</div>

.father {
   position: relative;
}

.img1 {
  position: relative;
}

.img2, .img3 {
  position: absolute;
  top: //some amount
  left: //some amount
}

当html下的div中出现错误时，img1被按下，但img2和img3保持不变。为什么会发生这种情况？我原以为整个div都会向下推，相对于div，img2和img3也会向下移动

出现错误后，DOM看起来像

---

通过将img2和img3设置为绝对位置，它们已从文档的标准流中删除。它们总是相对于最近的祖先进行定位。在本例中，这是

父类

div。因此，无论您为其

顶部

值设置了什么，都将始终是它们距离

父类

div顶部的距离。

添加错误后DOM到底是什么样子的？尽管在img1上设置了position:relative，它实际上没有设置到任何特定的位置，因此它仍然会与周围的内容一起流动。您能否指定错误出现的确切位置以及它的组成部分？您的问题的一个实例将大有帮助。你可以在这里发布你的HTML/JS，并发布一个链接供我们查看：为你创建了一个JSFIDLE，但是父div由于出现错误而向下移动，那么为什么子div也没有向下移动呢？你的问题并没有说父div正在移动。。。我认为你需要更新问题，更详细地了解到底发生了什么，或者更好的是，包括一个活生生的例子。