JSFiddle - React, Tailwind, and code Playground

by Andy Blueman

HTML

<div id="left">L</div><div id="right">R</div>

CSS

*, *:before, *:after {
    box-sizing:inherit;
}
html {
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    box-sizing:border-box;
}
body {
    width:100%;
    height:100%;
    margin:0;
    padding:0;
    display:inline-block;
}
#left {
    height: 100%;
    width: 50%;
    position: absolute;
    left:0;
    margin:0;
    padding:0;
    display:inline-block;
    border:1px solid red;
}
#right {
    height: 100%;
    width: 50%;
    position: absolute;
    right:0;
    margin:0;
    padding:0;
    display:inline-block;
    border:1px solid blue;
}

JavaScript

$(function () {
      $("#left").resizable({
          alsoResize: "#right"
      });
      $("#right").resizable();
  });
  $(function () {
      $("#right").resizable({
          alsoResize: "#left"
      });
      $("#left").resizable();

  });