JSFiddle - React, Tailwind, and code Playground

by luka kupunia

HTML

<div id="body"></div>
<div id="box"></div>

CSS

body {
  margin: 0;
  overflow: hidden;
}
#body {
  max-width: 1200px;
  margin: auto;
  padding-top: 20%;
  background: purple;
}
#box {
  width: 100%;
  padding-top: 10%;
  background: yellow;
  margin-top: 20px;
}

JavaScript

function trans(){
	var a = document.querySelector('#body');
  var b = document.querySelector('#box');
  var offsetX = a.offsetLeft;
  b.style.transform = 'translateX(' + offsetX + 'px)';
  console.log(offsetX);
}
trans();

window.addEventListener('resize',trans)