JSFiddle - React, Tailwind, and code Playground

by agus makmun

HTML

<div class='description'>
    <div class='images-des'>
        <img src="http://image2.putlocker.is/images/covers/300-rise-of-an-empire-online-free-putlocker.jpg" title='' alt=''/>
    </div>
    <li>Genre: <span>Action | Drama | War</span></li>
    <li>Director: <span>Noam Murro</span></li>
    <li>Stars: <span>Sullivan Stapleton, Eva Green, Lena Headey</span></li>
    <li>Synopsis:
    <span>After its victory over Leonidas' 300, the Persian Army under the command of Xerxes marches towards the major Greek city-states. The Democratic city of Athens, first on the path of Xerxes' army, bases its strength on its fleet, led by admiral Themistocles. Themistocles is forced to an unwilling alliance with the traditional rival of Athens, oligarchic Sparta whose might lies with its superior infantry troops. But Xerxes still reigns supreme in numbers over sea and land.</span></li>
    
</div>

CSS

.description {
margin: .3em 0;
}
.images-des img {
float: left;
border: 1px solid #2C2C2C;
padding: 2px;
margin-right: 5px;
}
.description li {
list-style: none;
font-weight: bold;
}
.description li:before {
content: url(http://3.bp.blogspot.com/-wNgF_skvVa8/VKlLeXcdhvI/AAAAAAAAAqI/gAClE-iE4Fw/s1600/li-arrow.gif);
width: 31px;
height: 20px;
margin: 0 5px;
}
.description li span {
    font-weight: normal;
}