JSFiddle - React, Tailwind, and code Playground

by Kyle

HTML

<body>  
    <div class="myDiv1">
        <div class="clsContainer div1">
            <img src="http://www.scicomcommerce.com/media/catalog/product/cache/1/image/5e06319eda06f020e43594a9c230972d/m/y/my-computer.jpg" alt="This shouldn't be empty"/>        
        </div>
        <div class="clsContainer div2">
            <div id="first"> 
                The quick brown fox jumps over some crap.
            </div>
            <div id="second"> 
                ThisIs a quick brown fox that jumps over some other long crap.
            </div>
        </div>
    </div>
</body>

CSS

.myDiv1
{
    overflow:auto;
    width:200px;
    clear:both;
    border:1px black solid;
    padding:4px;
}

.div1
{
    border:1px solid black;
    margin-right:3px;
    float:left;
}

.div1 img
{
    height:50px;
    width:50px;
}

.div2
{
    float:left;
}

#first
{
    width: 138px;
    border:1px solid black;
    margin-bottom:3px;
    word-wrap:break-word;
    padding:2px;
}

#second
{
    border:1px solid black;
    margin-top:8px;
    width: 138px;
    word-wrap:break-word;
    padding:2px;
}