JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
<div class="item">
    <h3>Product Name</h3>
    <a href="#">
        <img src="http://imaging.nikon.com/lineup/dslr/img/product_d7000.png" />
    </a>
    <label>
        Price: <b>$123.45</b>
    </label>
    <time>12:34:56</time>
    <button>Bid!</button>
</div><div class="item">
    <h3>Product Name</h3>
    <a href="#">
        <img src="http://imaging.nikon.com/lineup/dslr/img/product_d800.png" />
    </a>
    <label>
        Price: <b>$123.45</b>
    </label>
    <time>12:34:56</time>
    <button>Bid!</button>
</div><div class="item">
    <h3>Product Name</h3>
    <a href="#">
        <img src="http://imaging.nikon.com/lineup/dslr/img/product_d4.png" />
    </a>
    <label>
        Price: <b>$123.45</b>
    </label>
    <time>12:34:56</time>
    <button>Bid!</button>
</div>
</div>

CSS

#container {
    width: 100%;
    text-align: center;
    font-family: Sans-serif;
}
.item {
    color: #333;
    width: 30%;
    margin: 4px;
    padding-bottom: 8px;
    text-align: left;
    border-radius: 3px;
    display: inline-block;
    border: 1px solid #999;
    background: #EEEEE0;
    text-shadow: 0 0 1px #999;
}
.item h3 {
    padding: 4px 0 8px;
    font-size: 20px;
    text-align: center;
}
.item img {
    width: 100%;
    border: solid transparent;
    border-width: 2px 0;
    box-shadow: 0 0 5px -2px #333;
}
.item label {
    margin: 4px 16px;
    display: block;
}
.item label b {
    float: right;
}
.item time {
    margin-left: 16px;
}
.item button {
    float: right;
    margin-right: 16px;
    border-radius: 3px;
    border: 1px solid #444;
    background: -moz-linear-gradient(to top, #BBB, #DDD);
}
.item:hover {
    color: #240;
    background: #ff3;
    box-shadow: inset 0 0 1px #FFF;
}
.item:hover h3 {
    color: #fff;
    background: #ff3;
    box-shadow: inset 0 0 1px #FFF;
}
.item:hover button {
    color: #240;
    border: 1px solid #360;
    background: -moz-linear-gradient(to top, #693, #9C6);
}
.item:hover button:hover {
    cursor: pointer;
    box-shadow: inset 0 0 2px #FFF;
}