JSFiddle - React, Tailwind, and code Playground

by Don Johnson

HTML

<div id="reviews">
  <div class='resultsbox'>
    <p class="header"><strong>Fun</strong><small>4-2-2012</small></p>
    <ul>
      <li>Name: mike<br>
        Review: 85</li>
      <li>Visit Date: 4-1-2012<br>
        Length</li>
      <li>Rate: $50<br>
        Tip: $10</li>
    </ul>
    <p class='review'>What a great time!<br>
      <cite>-Rodger</cite></p>
  </div><!-- /.resultBox -->
  <div class='resultsbox'>
    <p class="header"><strong>hsdhs asdhasdhd</strong><small>1-1-2012</small></p>
    <ul>
      <li>Name: donika<br>
        Review: 52</li>
      <li>Visit Date: 1-1-2012<br>
        Length: 6 Hours</li>
      <li>Rate: $50<br>
        Tip: $10</li>
    </ul>
    <p class='review'>dim simbia kalj kalkd kj ,asd l iosdj fkallksjf laskjdf dim simbia kalj kalkd kj ,asd l iosdj fkallksjf laskjdf dim simbia kalj kalkd kj ,asd l iosdj fkallksjf laskjdf  dim simbia kalj kalkd kj ,asd l iosdj fkallksjf laskjdf dim simbia kalj kalkd kj ,asd l iosdj fkallksjf laskjdf dim simbia kalj kalkd kj<br>
      <cite>-Rodger</cite></p>
  </div><!-- /.resultBox -->
</div><!-- /#reviews -->

CSS

* {
	margin:0;
	padding:0;
}
#reviews {
	width: 900px;
	margin:0 auto;
}
.resultsbox {
	border-top: solid 2px #DDD;
	border-radius: 5px;
	padding:40px;
}
.resultsbox .header {
	padding:0 0 1em 0;
	overflow:hidden;
}
.resultsbox .header strong {
	float:left;
}
.resultsbox .header small {
	float:right;
}
.resultsbox ul {
	list-style:none;
	width:80%;
	padding:0 0 0 10%;
	overflow:hidden;
}
.resultsbox ul li {
	width:33%;
	float:left;
	text-align:left;
	padding:0 0 1em;
}
.review {
	margin: 0 0 0 10%;
}
.review cite {
	padding:1em 0 0 0;
	display:block;
}