JSFiddle - React, Tailwind, and code Playground

HTML

<div id="content">
    <h2>Title</h2>
    <span id="date">22/05/2014</span> <br /> 
    <img class="img" src="../image1.jpg"/>
    <p>
        Paragraph text     
    </p>
    <div id="downloads">
        <h3>Links:</h3>
        <ul class="links">
            <li><a href="">Link bigger</a></li>
            <li><a href="">Link</a></li>
            <li><a href="">Link 3</a></li>
        </ul>
    </div>
    <span class="back">Back</span>
</div>

CSS

#content
{	
	text-align:center;
	width:100%;
	margin:0 auto 0 auto;
	background:#fff;
    background:blue;
}

#content .img
{
	width:200px;
	height:220px; 
	float:left;
	margin-right:10px;
	border:5px solid #f3f3f3;
	margin-top:15px;
	
}



#content #date
{
	width:100%;
    font-size:14px; 
	text-align:center;
	color:#7a7a7a;
    background:Red;
}


#content h2
{
	width:100%;
    font-size:23px; 
	text-align:center;
    background:green;
}

#content p
{
	font-size: 17px;  
	text-align:justify;
	line-height:25px;
	word-spacing:-2px;
	width:100%;
	margin-top:15px;
	background:yellow;
	min-height:230px;	
}

#content .back
{
	float:left; 
	margin-top:15px;
	text-decoration:none; 
	font-size:15px; 
	width:100%;
	text-align:center;
	cursor:pointer;
} 

#downloads  h3
{
   background:purple;
}

.links li
{
        text-align : left;
}

.links 
{
    list-style-type:none;
    margin:0 auto; 
    display:table;
}

.links li a 
{
    text-decoration:none;
    background:red;
    color:#000;
    margin-top:20px;
    margin:0 auto; 

}