JSFiddle - React, Tailwind, and code Playground

HTML

<a class="item" href="http://google.com">
    <div class="itemImg">
        <img src="http://img-fotki.yandex.ru/get/4512/vmazann.0/0_52db2_1c3135a9_orig.jpg" alt=""/>
    </div>
    <h3>Hello World</h3>
</a>

CSS

.item {
    color: #140804;
    cursor: pointer;
    padding: 17px;
    position: relative;
    text-align: center;
    text-decoration: none;
    width: 142px;
    display:block;
    background:green;}
.item * {
    cursor: pointer;}
.itemImg {
    background: none repeat scroll 0 0 red;
    height: 150px;
    line-height: 150px;
    margin-bottom: 10px;
    overflow: hidden;
    text-align: center;
    vertical-align: middle;}
.itemImg img {
    vertical-align: middle;}