JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content">
<div style="height: 100%; display: inline-block">
  <ul class="col_selector_container" id="ulUnusedColumns">
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
  </ul>
  </div>
  <div class="__outline__" style="height: 100%; display: inline-block">
    <ul class="col_selector_container" id="ulUsedColumns"></ul>
  </div>
</div>

CSS

ul.col_selector_container 
{
    overflow-y: scroll;
    list-style-type: none;
    height: 100%;
    width: 300px;
    display:inline-block;
    vertical-align:top;
    padding-left: 0px;
}