<ul> <li><a href="#">Home</a></li> <li><a href="#">Page 2</a></li> <li><a href="#">Page 3</a></li> <li><a href="#">Page 4</a></li> <li><a href="#">Some Other Page</a></li> </ul>
ul { margin-top: 10px;} ul li { border-bottom: 28px solid #c50723; border-left: 28px solid transparent; border-right: 28px solid transparent; height: 0; display: inline-block; margin: 0 -35px 0 0; padding: 0; } ul li:hover { border-bottom: 28px solid #f98a4e; } ul li a { color: #fff; display: block; float: left; margin: 0; padding: 5px; text-decoration: none; }