JSFiddle - React, Tailwind, and code Playground

HTML

<html>

   <head> 
   <meta http-equiv="X-UA-Compatible" content="IE=edge">    
  </head> 
 
  <body> 
    
    <div class="grid grow"> 
        <div class="tablerow">
            <div class="tablecell" style="border: solid 3px">
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
            </div>
        </div> 
      
        <div class="tablerow grow">
            <div class="tablecell grow" style="border: solid 3px">
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
                a<br>
            </div>
        </div> 
        
    </div> 
    
</body></html>

CSS

html, body {
      margin: 0; padding: 0;
      bottom:0px;
      height:100%;
    }
    
    .grid {
      display : table;
      width:100%;
    }
  
    .tablerow {
      display : table-row;
    }
  
    .tablecell {
      display : table-cell;
    }
   
    .grow {
      bottom:0px;
      height:100%;
    }