I have the following code. In IE the link works normally, but in Chrome it does not. When I change the "nav-menu" to something else the link works.
<nav id="menu">
<ul id="menu-nav">
<li class="current"><a href="#home-slider">Home</a></li>
<li><a href="#work">Produtos</a></li>
<li><a href="#about">Quem Somos</a></li>
<li><a href="#contact">Contato</a></li>
<li><a href="https://www.facebook.com/madeiradecormga" title="Siga-nos no Facebook" target="_blank" class="external"><span class="font-icon-social-facebook"></span></a></li>
<!-- <li><a href="shortcodes.html" class="external">Shortcodes</a></li> -->
</ul>
</nav>
a{
color:#00FF00;
text-decoration: none;
cursor: pointer;
-webkit-transition: color 0.1s linear 0s;
-moz-transition: color 0.1s linear 0s;
-o-transition: color 0.1s linear 0s;
transition: color 0.1s linear 0s;
}
a:hover{
outline: 0;
color:#FFFFFF;
text-decoration:none;
}
a:active{
outline: 0;
color:#FFFFFF;
text-decoration:none;
}
a:focus{
outline: 0;
color:#FFFFFF;
text-decoration:none;
}
a img {
border: none;
}
a > img {
vertical-align: bottom;
}
img {
max-width: none;
}
.
.
.
.
.
nav#menu {
float: right;
margin-right: 20px;
}
nav#menu #menu-nav {
margin: 0;
padding: 0;
}
nav#menu #menu-nav li {
list-style: none;
display: inline-block;
margin-left: 50px;
}
nav#menu #menu-nav li:first-child {
margin-left: 0;
}
nav#menu #menu-nav li a {
color: #FFFFFF;
font-size: 16px;
font-weight: 300;
line-height: 60px;
display: block;
text-transform: uppercase;
}
nav#menu #menu-nav li.current a,
nav#menu #menu-nav li a:hover {
color: #00FF00;