JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html><head><meta charset="utf-8">
<title>Run it in chrome</title>
<style>
body {
background-color: #ddd;
margin: 0;
padding: 0;
}
#x {
position:absolute;
background-color: #990000;
color:white;
}
.a{left:0;top:200px;}
.b{left:0;top:0;}
.c{left:200px;top:200px;}
.trans{-webkit-transition:all 1s ease-in-out;}
</style>
<script type="text/javascript">
function run(){
var div = document.getElementById('x');
div.className = 'b';
var tmp = div.offsetTop; // read a property to force an Dom update.
div.className = 'trans c';
}
</script></head><body><div id='x' class='a'><button onClick='run()'>run</button></div></body></html>