JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <nav>
        <ul>
            <li><a href="#">One</a><div></div></li>
            <li><a href="#">Two</a><div></div></li>
            <li><a href="#">Three</a><div></div></li>
            <li><a href="#">Four</a><div></div></li>
            <li><a href="#">Five</a><div></div></li>
            <li><a href="#">Six</a><div></div></li>
        </ul>
    </nav>
</div>

CSS

.container {
    width: 960px;
	max-width: 90%;
	margin: 0 auto;
}
ul {
    width: 100%;
}
li {
    float: left;
    width: 16%;
    list-style: none;
    text-align: left;
}
li a {
    float: left;
    display: block;
}
li div {
    min-height: 20px;
	background: url(http://bit.ly/1wxK23y) no-repeat center;
	overflow: hidden;
}