JSFiddle - React, Tailwind, and code Playground

by SebastianPataneMasuelli

HTML

<div id="relative">
    relative
    <div id="absolute">
        absolute;
    </div>
</div>

CSS

#relative {
  position: relative;
  left: 100px;
  top: 100px;
   border: 1px solid black; 
}

#absolute {
    position: absolute;
    left: 10px;
    border: 1px solid red;
    top: 10px;
}

JavaScript

var relativeLeft = $('#relative').css('left');
var absoluteLeft =  $('#absolute').css('left');
var returnToOriginLeft = (parseInt(absoluteLeft) - parseInt(relativeLeft)) + 'px';
var relativeTop = $('#relative').css('top');
var absoluteTop =  $('#absolute').css('top');
var returnToOriginTop = (parseInt(absoluteTop) - parseInt(relativeTop)) + 'px';

$('#absolute').css('left', returnToOriginLeft);
$('#absolute').css('top', returnToOriginTop);