Javascript 高度设置为自动时的div定位

我在编写html代码时遇到了一个场景。。在一些浮动div之间。。。有两个绝对定位的div。。我创建了一个示例JSFIDLE来说明这个问题。。尝试输入一个长文本，例如“CSS溢出隐藏在绝对位置。如何防止…溢出的大小：隐藏在位置的div：绝对位置内的CSS/HTML…”。。然后点击submite按钮…它将附加到主容器中。。。由于文本太长，且该容器div设置为auto.。它将扩展并位于textbox容器div.后面。。无论如何，我都要让文本框容器根据主容器获得可见区域所需的高度向下移动，如果不需要，再向上移动。。由于一个因素，我使用绝对定位。当我添加宽度时：css中的100%。。该div通常在左边缘和该div的开始之间留下一个间隙。。。它显示为一个空白。。请检查小提琴

HTML 进入

CSS

---

​

问题在于使用position:absolute。如果从这两个div元素中删除该元素，并允许它们成为块级元素，则将允许按预期渲染所有内容。如果需要绝对定位这些元素，我建议创建一个位置相对的父元素，这样它就不会出现在页面上其他div的后面

---

您可以像其他答案指定的那样计算高度，但我认为如果可能，最好将其留给浏览器。

最简单的解决方案是获取新元素的高度，然后将其添加到顶部

$("#textboxContainer").css("top", $("#mainContainer").height() + 20);

---

这将使底部容器降低到正确的高度。这里有一个指向的链接。

对我来说，没有问题（使用谷歌Chrome）它在div之前进入。对。。。添加一个长文本，如我的示例中的文本..这一个有问题..让我在我的网站中尝试一下如果你输入空白文本，这将使div移动到比开始位置更高的位置

$("#textboxContainer").css("top", $("#mainContainer").height() + 20);