javascript - 使 div 的高度与其中的绝对 div 相同

Question

我有一个 div（具有相对位置），里面有两个 div。其中一个具有绝对定位，我注意到它超出了 div 的父级边距。

我想让 div 父级（以及其他非绝对定位 div）的高度与绝对定位 div 的高度相同。

基本上，我希望容器 div 及其内部的所有 div 将它们的高度调整为所采用的最高高度。

你能帮我理解怎么做吗？

.container {
  width: 100vw;
  height: auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin: 0;
  background-color: blue;
}
.element {
  width: 50%;
  padding: 50px 150px 90px 50px;
  box-sizing: border-box;
  font-size: 30px;
  position: relative;
  font-family: 'helvetica','arial',sans-serif;
}
#element-1 {
  background-color: beige;
}
#element-2 {
  background-color: darkGreen;
  color: white;
  position: absolute;
  right: 0;
}

<div class="container">
  <div class="element"  id="element-1">
    <h1>Lorem Ipsum Dolor</h1>
  </div>
  <div class="element" id="element-2">
    <h1>Lorem ipsum dolor sit amet</h1>
  </div>
</div>

标签： javascripthtmljquerycsscss-position