如何使用 Bootstrap 4 绝对和响应地定位 div

Question

在我的项目中，我使用的是 Bootstrap 4。我喜欢将下面的图像绝对定位在.row中，但我找不到像在 Bootstrap 5 中那样的正确类，如top-0 top-50等。

我应该自己写课程吗？ 我也需要它来响应。 所以我不想为每个断点编写媒体查询。

我想做的是如下：

<div class="container mb-10">
  <div class="row position-relative">
    <div class="col-12 col-md-6 mb-6 mb-md-0">
      <div class="p-8 p-sm-9 img-container" >
        <img src="/myImage1.png" class="img-fluid" alt="">
      </div>
    </div>
    <div class="col-12 col-md-6 text-center text-md-left">
      <h2 class="display-3 font-weight-bold ">Education</h2>
      <p class="text-muted">Lorem ipsum dolor sit amet consectetur, adipisicing elit. Odio reprehenderit ipsa repellendus nam debitis. Quaerat, delectus consequuntur quasi adipisci aspernatur cumque facere mollitia ea sit, minima, veniam beatae molestias voluptatibus!</p>
    </div>
    <div class="position-absolute top-50 end-0 top-md-70 end-md-30">
      <img src="/myImage2.png" alt="">
    </div>
  </div>
</div>