JSFiddle - React, Tailwind, and code Playground

by jeklund

HTML

<script src="https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox.js"></script>
<script src="https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/js/listbox-scrollable.js"></script>
<link rel="stylesheet" href="https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/css/listbox.css">
<script src="https://www.w3.org/TR/2017/WD-wai-aria-practices-1.1-20170628/examples/js/app.js"></script>
<script src="https://www.w3.org/TR/2017/WD-wai-aria-practices-1.1-20170628/examples/js/examples.js"></script>
<script src="https://www.w3.org/TR/2017/WD-wai-aria-practices-1.1-20170628/examples/js/highlight.pack.js"></script>
<script src="https://www.w3.org/TR/2017/WD-wai-aria-practices-1.1-20170628/examples/js/utils.js"></script>
<div class="listbox-area">
          <div class="left-area">
          <span id="ss_elem">Our Family Members</span>
           <ul id="ss_elem_list" tabindex="0" role="" aria-labelledby="ss_elem">
         
              <li id="ss_elem_Np" role="option">Ben</li>
              <li id="ss_elem_Pu" role="option">Gina</li>
              <li id="ss_elem_Am" role="option">Jack</li>
              <li id="ss_elem_Cm" role="option">Joshua</li>
              <li id="ss_elem_Bk" role="option">Justin</li>
              <li id="ss_elem_Cf" role="option">Michael</li>
              <li id="ss_elem_Es" role="option">Michaela</li>
              <li id="ss_elem_Fm" role="option">Robert</li>
            </ul>
          </div>
        </div>