JSFiddle - React, Tailwind, and code Playground

HTML

<div class="parent">
  <div class="child"></div>
</div>

SCSS

.parent {
  transform: translateX(50%);
}

.child {
  width: 50px;
  height: 50px;
  background: red;
}

JavaScript

var par = document.querySelector(".parent"),
	child = par.querySelector(".child");

var parStyles = window.getComputedStyle(par, null);
// Update the child with both combined
child.style.transform = parStyles.getPropertyValue("transform") + "rotate(10deg)";
// Optionally remove the parent's transform
par.style.transform = "none";