JSFiddle - React, Tailwind, and code Playground

by nhuon

HTML

<link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
<div class="container">
    <div class="left" style="border:1px solid #DDD;">
        <div class="left">
            <img src="https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcRibf_BsPYqsOTmjEnbI7cxAbLmlGi0F1--nFKpVkL2XE6tdir1" alt="">
        </div>
        <div class="right">
            <h2>Hobtown</h2>
            <br>
            <p>
            The Shire is a region of J. R. R. Tolkien's fictional Middle-earth, described in The Lord of the Rings and other works. The Shire refers to an area settled exclusively by Hobbits and largely removed from the goings-on in the rest of Middle-earth.
            
            The Shire is a region of J. R. R. Tolkien's fictional Middle-earth, described in The Lord of the Rings and other works. The Shire refers to an area settled exclusively by Hobbits and largely removed from the goings-on in the rest of Middle-earth.                
            </p>
        </div>
    </div>
    <div class="right" style="background-color:#DDD;height:600px;"></div>    
</div>

CSS

*
{
    font-size:12px;
    font-family: 'Open Sans', sans-serif;
}
h2
{
    font-size:16px;
}
.container
{
}

.left
{
    float:left;
    width:65%;
}

img
{
    padding:10px;
}
.right
{
    padding:10px;
    margin-left:65%;
}