JSFiddle - React, Tailwind, and code Playground

by kouty79

HTML

<div class="h">
  123<br>
  <span id="out"></span>
</div>
<div class="a">
  <div class="b">
    AAA
  </div>
</div>

CSS

.a {
  position: relative;
  border: 1px solid grey;
}

.b {
  position: absolute;
  top: 100px;
}

.h {
  height: 100px;
  border: 1px solid red;
}

JavaScript

const offsetTop = document.querySelector('.b').offsetTop;
const offsetParent = document.querySelector('.b').offsetParent;

document.querySelector('#out').innerHTML = offsetTop + ' parent ' + offsetParent.className;