JSFiddle - React, Tailwind, and code Playground

HTML

<table border="0" cellspacing="12px" cellpadding="0" width="100%" height="100%">
    <tr>
        <td style="width:100%; height:10px;">
            &nbsp;
        </td>
    </tr>
    <tr>
        <td style="width:100%; padding-top:0;">
            <table class="fill-cell" id="tree_view" style="width:100%;" cellpadding="0" cellspacing="0">
                <tr>
                    <td style="height:100%;">
                        <div class="fill-cell" style="height:100%; border:10px solid salmon; background-color: steelblue;">
                            jkdfhs                            
                        </div>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

CSS

* {
    -webkit-box-sizing: border-box; 
   -moz-box-sizing:    border-box; 
   box-sizing:         border-box; 
}

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

JavaScript

$(document).ready(function () {
    
    var elements = $('.fill-cell');
    
    elements.each(function (index, element) {
        
        element = $(element);
        var cell = element.parent('td');
        
        if (cell.length > 0) {
            var x = Math.floor(cell.height());
            element.outerHeight(x);
        }
        
    });
    
});