对此有几种解决方案
1.使用background-image并且不使用positionabsolute.见下面的片段

.parent {
  position: relative;
  min-height: 300px;
  border: 1px solid;
  background-image: url('https://via.placeholder.com/350x150');
  background-repeat: no-repeat;
  background-size: cover;
}

.child {
  width: 200px;
  height: auto;
  border: 1px solid;
}

<div class="parent">
    <div class="child">
        Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.
    </div>
</div>

1.使用jQuery赋予父对象与子对象相同的高度，并使用img标记
一个一个二个一个一个一个三个一个一个一个一个一个四个一个

子元素必须是绝对的有什么特别的原因吗？我看不出有什么必要，因为子元素是嵌套的。如果你在父元素div中添加填充，那么你可以在子元素div中添加任意多的内容，而不会有重叠。

.parent {
  min-height: 300px;
  width: 100%;
  border: 1px solid;
  padding: 1em;
  background-image: url('https://via.placeholder.com/350x150');
  background-repeat: no-repeat;
  background-size: cover;
}

下面是一个例子：JSFiddle

我知道这可能不再是你的问题了，但是，我想在这里提出一个重要的问题，这将使相对位置和绝对位置不太理想。相对位置和绝对位置需要一个静态高度，你将不得不在媒体查询中不断更新，以类似于某种动态高度行为。这是非常难以维护的，因为不是所有的设备都以相同的方式 Package 段落。
当你处理段落时，你必须考虑所有 windows 大小的灵活性和响应式设计。段落会随着段落换行和创建新行而动态地改变div高度，因此段落的高度也会改变。这会影响段落下面的项目。
以下是使用栅格显示的更动态的解决方案。

<div class="translate-parent">
   <div id="p_one" class="translate-child">
     <p> I AM PARAGRAPH 1. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
   </div>
   <div id="p-two" class="translate-child">
     <p> I AM PARAGRAPH 2 WITH LESS CONTENT, THUS LESS HEIGHT. Sit amet luctus venenatis lectus magna. Aliquet sagittis id consectetur purus. Elementum eu facilisis sed odio. Tempus imperdiet nulla malesuada pellentesque elit eget</p>
   </div>
</div>

在你的css中这样做：

.translate-parent {
  display: grid;
  grid-template-columns: 100% 1fr;
  grid-template-rows: 100% 1fr;
}
.translate-child {
  grid-area: 1 / 1 / 2 / 2;
}

下面是一个CODEPEN，它向您展示了段落下面的按钮如何根据上面元素的高度进行调整。