JSFiddle - React, Tailwind, and code Playground

by Victor

HTML

<ul id="pageNav">
	<li><a href="">Menu Item</a></li>
	<li><a href="">Menu Item</a></li>
	<li><a href="">Menu Item</a></li>
	<li><a href="">Menu Item</a></li>
	<li><a href="">Menu Item</a></li>
</ul>

CSS

#pageNav {
	background: -moz-linear-gradient(top,  #000000 0%, #666666 50%, #000000 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(50%,#666666), color-stop(100%, #000000)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #000000 0%,#666666 50%, #000000 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #000000 0%,#666666 50%, #000000 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #000000 0%,#666666 50%, #000000 100%); /* IE10+ */
	background: linear-gradient(top,  #000000 0%,#666666 50%, #000000 100%); /* W3C */
    height:auto;
    list-style-type:none;
}
#pageNav li a {
    margin: 0;
    width:100%;
    padding: 3px 0 3px;
    border-top:#666666 solid 1px;
    border-bottom: solid 1px #000000;
    display:block;
        color:white;
    text-decoration:none;
    font-size:1.4em;
    font-weight:700;
        font-family:arial;
        text-shadow:3px 3px 4px #000000;
}