JSFiddle - React, Tailwind, and code Playground

HTML

<div class="outside">
    <div class="inside">
        xyz
    </div>
</div>

CSS

.outside{
height: 300px;
    border: 1px solid green;
}

.inside{
    border: 1px solid red;
    
    /* not working*/
   /*  display: table-cell;
    vertical-align: bottom;
    */
    
    /* i want the red at the bottom of the green, not in the page */
    position:absolute;
    bottom: 0;
    
}