JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html>
<html lang="en">
<body>
    <table>
        <tr>
            <td class="wrapper">
                <div id="pink">Pink</div>
                <div id="green">Green</div>
            </td>
            <td class="wrapper">
                <div id="yellow">
                    Big yellow text
                </div>
            </td>
        </tr>
  </table>

</body>
</html>

CSS

td.wrapper {
    background-color:cyan;
}
div#pink {
    background-color:pink;
    float:left;
}
div#green {
    background-color:green;
    float:left;
}

div#yellow{
    background-color:yellow; 
    font-size: 40pt;
}

JavaScript

d = document.getElementById('yellow').offsetHeight;
document.getElementById('pink').style.height = d+'px';