JSFiddle - React, Tailwind, and code Playground

by Regisc

HTML

<table>
    <tr>
        <td colspan="4">First column</td>
        <td colspan="8">Second column</td>
    </tr>
    <tr class="empty">
        <td colspan="8">&nbsp;</td>
    </tr>
    <tr>
        <td colspan="4">Price:</td>
        <td colspan="4" width="50px"></td>
        <td colspan='1' style="text-align: right">Value</td>
        <td style="padding-left:10px" colspan='1'>Currency</td>
        <td colspan='2'>&nbsp;</td>
    </tr>
    <tr>
        <td colspan="4"></td>
        <td colspan="4"></td>
        <td colspan="1" style="text-align: right">100</td>
        <td colspan="1" class="pull-right">USD
            <td colspan="2" style="height:10px;">&nbsp;</td>
    </tr>
    <tr>
        <td colspan="4"></td>
        <td colspan="4"></td>
        <td colspan="1" style="text-align: right">3000</td>
        <td colspan="1" class="pull-right">USD
            <td colspan="2" style="height:10px;">&nbsp;</td>
    </tr>
    <tr>
        <td colspan="4"></td>
        <td colspan="4"></td>
        <td colspan="1" style="text-align: right">12000</td>
        <td colspan="1" class="pull-right">USD
            <td colspan="2" style="height:10px;">&nbsp;</td>
    </tr>
    <tr>
        <td colspan="4"></td>
        <td colspan="4"></td>
        <td colspan="1" style="text-align: right">400</td>
        <td colspan="1" class="pull-right">USD
            <td colspan="2" style="height:10px;">&nbsp;</td>
    </tr>
</table>

CSS

.pull-right {
    padding-left: 10px;
}