JSFiddle - React, Tailwind, and code Playground

HTML

<body>
<div id="menu_container">
  <div id="login_container">
  </div>
  <ul id="list_container">
            <li class="category_b">
                <p>1</p>
            </li>
            <li class="category">
                <p>2</p>
            </li>
            <li class="category_b">
                <p>3</p>
            </li>
            <li class="category">
                <p>4</p>
            </li>
            <li class="category_b">
                <p>5</p>
            </li>
            <li class="category">
                <p>6</p>
            </li>
            <li class="category_b">
                <p>7</p>
            </li>
            <li class="category">
                <p>8</p>
            </li>
            <li class="category_b">
                <p>9</p>
            </li>
            <li class="category">
                <p>10</p>
            </li>
            <li class="category_b">
                <p>11</p>
            </li>
            <li class="category">
                <p>12</p>
            </li>
            <li class="category_b">
                <p>13</p>
            </li>
            <li class="category">
                <p>14</p>
            </li>
    </ul><!-- list_container -->
</div>


</body>

CSS

body,html {
        margin: 0;
        height:100%;
          }

      body{
          position:relative;
    
      }
      #menu_container {
        background-color: #31393D;
        width: 250px;
        height: 100%;
        left: 0;
        position: fixed;
      }
      
      #login_container {
        background-color: #282F33;
        width: 250px;
        height: 30%;
        left: 0;
      }
      
      #list_container {
        width: 250px;
        height: 70%;
        margin: 0;
        padding: 0;
        overflow-y: auto;
        overflow-x: hidden;
      }
      
      #list_container p {
        left: 20px;
        display: block;
        position: relative;
        font-size: 12pt;
        margin: 16px 0 0 20px;
        color: #cacaca;
      }
      
      #list_container li {
        width: 250px;
        height: 50px;
        float: left;
        display: block !important;
      }
      
      .category {
        border-top: 2px solid #282F33;
        background-color: #2C3438;
      }
      
      .category_b {
        border-top: 2px solid #282F33;
        background-color: #4e5254;
      }