<div>
<ul>
<li><span>1</span></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>
</div>
div{
padding:20px;
}
ul{
text-align:center;
letter-spacing:-1em;
li{
display:inline-block;
a,span{
display:block;
padding:2em;
background:#efefef;
text-decoration:none;
color:#333;
letter-spacing:normal;
}
a:hover,span{
background:#2f80e1;
color:#fff;
}
}
}
View Compiled
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.