JSFiddle - React, Tailwind, and code Playground

by panchroma

HTML

<div class="wrapper">          
<div id="leftDiv">

                <table id="mytable" class="table" style="width: 300px" >
                    <thead>
                        <tr style="background-color:#C0DBE5">
                            <th>Order Quantity</th>
                            <th>Price</th>
                        </tr>
                    </thead>
                    <tbody id="mytableb">
                        <tr><td>1</td><td>$12</td></tr>
                        <tr><td>2</td><td>$14</td></tr>
                        <tr><td>5</td><td>20</td></tr>
                        <tr><td>10</td><td>$30</td></tr>
                    </tbody>
                </table>
</div>

            <div id="rightdiv">
                <h5 style="color:green"><b>Only $2 item! + $5  fee </b></h5>
                <h5 style="color:green"><b>Get item for <span style="color:#000">Test</span>,<span style="color:red">Test B</span> and other music sites...</b></h5>

                <h5 style="color:red"><b>Get your item now!</b></h5>

            </div>
</div>

CSS

#leftDiv{
    background-color:#fcf;
    float:left;
}
#rightdiv{
    background-color:#aaa;
    float:left;
    margin-left:20px;
}