JSFiddle - React, Tailwind, and code Playground

by calder12

HTML

<div class="test clearfix">
    <div class="leftSide">
    <p class="vertical">p r o g</p>
    </div>
    <img  src="http://www.esig.org/uploads/images/illustration-cars.gif" />
    <div class="link"><a href="#">one</a> <a href="#">two</a> <a href="#">test</a>
<a href="#">three</a> <a href="#">fourtest</a> 

<a href="#">example</a> <a href="#">&lt;&lt;more </a>
    </div>
</div>

CSS

.test{margin:10px;width:500px;border:4px solid #CCC;padding:10px;}
img{float:left;margin:10px;}
.leftSide{float:left;}
.link{float:left;width:200px;font-size:29px;padding:20px;line-height:60px;text-align:justify;}

.clearfix:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;}
.vertical{width:20px;font-size:40px;height:200px;padding-top:10px;}