JSFiddle - React, Tailwind, and code Playground

by Pralhad Sonar

HTML

<table id="table1">
    <tr>
        <td class="table1-td-left">LHS</td>
        <td class="table1-td-right">
            <table id="table2">
                <tr>
                    <td class="table2-td-left">Content # 1</td>
                    <td class="table2-td-right">Content # 2</td>
                </tr>
            </table>
        </td>
    </tr>
</table>

CSS

table{
border:1px solid #c4c4c4;
}
td{
border:1px solid #c4c4c4;
}
#table1{
width: 800px;
}
.table1-td-left{
height:400px;
width:200px;
background-color: green;
}
.table1-td-right{
width:600px;
background-color: yellow;
}
.table2-td-left{
background-color: red;
    width: 200px;
}
.table2-td-right{
background-color: blue;
    width: 300px;
}