JSFiddle - React, Tailwind, and code Playground
HTML
<div id="A"></div>
<div id="B"><button>toggle</button></div>
CSS
html, body {
margin: 0;
padding: 0;
border: 0;
}
#A, #B {
position: absolute;
}
#A {
top: 0px;
width: 200px;
bottom: 0px;
background:orange;
}
#B {
top: 0px;
left: 200px;
right: 0;
bottom: 0px;
background:green;
}
#BB {
top: 0px;
left: 0px;
right: 0;
bottom: 0px;
background:green;
}
JavaScript
$('button').toggle(
function() {
$('#B').animate({left: 0})
}, function() {
$('#B').animate({left:200})
})