JSFiddle - React, Tailwind, and code Playground
HTML
Click on div below for animation:
<br /><br />
<div class="outer"><div class="inner">innerContent</div></div>
CSS
div.outer {
cursor: pointer;
position: absolute;
padding: 10px;
background: purple;
}
div.inner {
position: relative;
padding-left: 0;
padding-right: 0;
width:0;
background: orange;
clip: auto; overflow: hidden;
}
JavaScript
$('.outer').click(function() {
$('.inner').animate({
width: 0,
paddingLeft: 0,
paddingRight: 0
}, 'slow');
});