JSFiddle - React, Tailwind, and code Playground

by Steve Tune

HTML

<div class="box1">
    <h2>Unordered List</h2>
    <p>This is a simple list</p>
    <ul>
        <li>First Item (bold)</li>
        <li>Second Item</li>
        <li>Third Item</li>
        <li>Last Item (underlined)</li>
    </ul>
</div>

<div class="box2">
    <h2>Button Jquery Demo</h2>
    <p>The background of this box should be set to white on document.ready()</p>
    <p>Clicking the button below will alternate the color of the border of this box to red and back to default on on each click.</p>
    <a href="javascript:void(0);" onclick="alternateColor();">Toggle Color</a>
</div>
<div class="box3">
    <h2>Table Example</h2>
    <p>Table rows should include a hover state</p>
    <table>
        <thead>
            <div id="col3">
                <tr>
                    <th>Driver</th>
                    <th>Hometown</th>
                    <th>Car</th>
                </tr>
            </div>
        </thead>
        <tbody>
            <tr>
                <td>John S.</td>
                <td>Lincoln, NE</td>
                <td>55</td>
            </tr>
            <tr>
                <td>Jane D.</td>
                <td>Omaha, NE</td>
                <td>24</td>
            </tr>
        </tbody>

        <tfoot>
            <tr>
                <td>Mike J.</td>
                <td>Albany, NY</td>
                <td>1</td>
            </tr>
        </tfoot>
    </table>
</div>

CSS

.box1,.box2,.box3{
	width: 300px;
    padding: 25px;
    margin: 25px;
    height: 240px;
    border-radius: 25px;
    display: inline-block;
	float:left;
}

.box1 {
    background-color: #4b4244;
    
}

.box2 {
    background-color: white;
}

.box3 {
    background-color: #4b4244;
}