JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="http://www.shamusyoung.com/promo/style.css">

<div style="width=100%;text-align:center;">

<a href="/twentysidedtale/?p=21860" title="The Best of 2013" target="_top"><div class="bawx"><h2>The Best of 2013</h2><img src="http://www.shamusyoung.com/promo/images/thumb_2013.jpg" width="145" style="
    /* min-height: 186px; */
"><p>My picks for what was important, awesome, or worth talking about in 2013.</p></div></a>&nbsp;<a href="/twentysidedtale/?p=19697" title="Spoiler Warning:<br>BioShock" target="_top"><div class="bawx"><h2>Spoiler Warning:<br>BioShock</h2><img src="http://www.shamusyoung.com/promo/images/thumb_sw_bioshock.jpg" width="145"><p>A confusing game that's really smart for a shooter, but kind of dumb compared to its RPG-focused forebears.</p></div></a>&nbsp;<a href="/twentysidedtale/?p=15248" title="The Witch Watch" target="_top"><div class="bawx"><h2>The Witch Watch</h2><img src="http://www.shamusyoung.com/promo/images/thumb_witch_watch.jpg" width="145"><p style="
">My first REAL published book, about a guy who comes back from the dead due to a misunderstanding.</p></div></a>&nbsp;<a href="/twentysidedtale/?p=16959" title="Spoiler Warning:<br>Mass Effect 3" target="_top"><div class="bawx"><h2>Spoiler Warning:<br>Mass Effect 3</h2><img src="http://www.shamusyoung.com/promo/images/thumb_sw_masseffect3.jpg" width="145"><p>Everyone was so worked up about how terrible the ending was that they overlooked how terrible everything else was. We're here to fix that.</p></div></a>&nbsp;<a href="/twentysidedtale/?p=17939" title="Overthinking Zombies" target="_top"><div class="bawx"><h2>Overthinking Zombies</h2><img src="http://www.shamusyoung.com/promo/images/thumb_zombies.jpg" width="145"><p>Let's ruin everyone's fun by listing all the ways in which zombies can't work, couldn't happen, and don't make sense.</p></div></a>&nbsp;

</div>

CSS

@import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
@import url(http://fonts.googleapis.com/css?family=Belgrano);


/* css resets */
body, div, dl, dt, dd, xul, xol, xli, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, blockquote {
	margin: 0;
	padding: 0;
}

html, html a {
    -webkit-font-smoothing: antialiased !important;
}

/*-----------------------------------------------------------------------------
Globals
-----------------------------------------------------------------------------*/

body {
  xbackground: 		 #ff0;
  font-family:       'Arial', sans-serif;
  font-size:         12px;
  margin:            0px;
  padding:           0px;
}

h2 { margin-bottom: 0px; font-size:small;}
img { opacity: 0.6; }

.bawx
{
  padding:        0px;
  margin:         3px;
  min-height:     336px;
  max-height:     336px;
  min-width:      145px;
  max-width:      145px;
  display:        inline-block;
  background:     #ccc;
  border-radius: 4px;
  text-align: left;
  vertical-align:text-top;
}

.bawx p {  padding:        4px; margin: 0px;}
.bawx h2 {  padding: 10px 5px;   min-height: 30px;  text-align: center;  /* background-color: #f0f0ee; */  border-radius: 4px;}

.bawx:hover { 
background:#fff;

}

.bawx:hover  img { opacity: 0.66; }

a {
  color: #000;
	text-decoration: none;
}

a:link {
  color: #000;
	text-decoration: none;
}

.header a 
{
  color: #00f;
	text-decoration: underline;
}