I have a horizontal navigation menu and I'd like to have the tab that coincides with the current page to be the same as the .nav li a:hover style.
I've tried this but it doesn't work:
I'm using HTML5. Any help would be appreciated.
Thanks
David
PHP:
.nav li {float: left}
.nav li a, .nav li a:visited {
display: block;
padding: 15px;
text-decoration: none;
font-weight: 700;
color: #fff;
font-size: 1.5em;
background:#6b8cc1;
text-align: center;
margin-right:5px;
}
.nav li a:hover {
color: #151515;
background-color: #ffcc33;
text-decoration: underline;
}
PHP:
.nav li current {
color: #151515;
background-color: #ffcc33;
text-decoration: underline;
}
<ul class='nav'>
<li class='current'><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Resources</a></li>
<li><a href="#">Contact/a></li>
</ul>
Thanks
David