JSFiddle - React, Tailwind, and code Playground

by framj00

HTML

<ul>
    <li>
        <img src="http://cdn.designrfix.com/wp-content/themes/designrfix/img/searchbtn.jpg"/>
        <a href="#">link 1</a>
    </li>
    <li>
        <img src="http://cdn.designrfix.com/wp-content/themes/designrfix/img/searchbtn.jpg"/>
        <a href="#">link 2</a>
    </li>
</ul>
<div style="clear: both;"></div>

CSS

ul li {
    display: block;
    float: left;
    text-align: center;
    width: 200px;
    height: 150px;
    border: 1px solid red;
}

ul li img {
text-align: center;
}

ul li a {
display: block;
}