Borde Color naranja en chrome al seleccionar una opcion en una lista

[ramiguens]

Hola, mi problema es el siguiente, he creado un menu como sigue:

<ul>
<li class="nivel1" tabindex="1"><span class="nivel1"><a href="Iframes/IframeTelevision.html" target="OpcionesCatalogo">Televisión</a></span> </li>
<li class="nivel1" tabindex="2"><span class="nivel1"><a href="Iframes/IframeVideo.html" target="OpcionesCatalogo">Video Corporativo</a></span> </li>
<li class="nivel1" tabindex="3"><span class="nivel1"><a href="Iframes/IframeInternet.html" target="OpcionesCatalogo" name="selected" >Internet</a></span> </li>
<li class="nivel1" tabindex="4"><span class="nivel1"><a href="Iframes/IframeComunicacion.html" target="OpcionesCatalogo">Comunicación</a></span>
</ul>

El problema es que en el chrome al seleccionar una opcion me aparece un borde de color naranja que no logro hacer que desaparezca cada vez que selecciono una opcion si alguien sabe porque puede ser debido agradeceria ayuda.

[alexk]

con el html que pones mi debugeador mental solo ve blanco y negro lo siento....
(pon todo el codigo implicado generador por tu navegador HTML/CSS o mejor la url de tu sitio)

[ramiguens]

Iniciado por alexk

con el html que pones mi debugeador mental solo ve blanco y negro lo siento....
(pon todo el codigo implicado generador por tu navegador HTML/CSS o mejor la url de tu sitio)

Ok, ahi va el css...

#menu {
position:absolute;
margin-top:106px;
margin-left:64px;
width:580px;
height:40px;
}

#menu ul {
list-style-type: none;

}

#menu ul li.nivel1 {
float: left;
width: 140px;
margin-right: 2px;
position: relative;
}
#menu ul li { float: left;
}

#menu ul li span a{display: block;
text-align:center;
text-decoration: none;
color:black;
background-image:url(_images/Fondo_Menu_Catalogo.gif);
background-repeat:no-repeat;
padding: 8px;
position: relative;
}
a:active {position: relative;

}
#menu ul li a:active {
color:#000;
position: relative;
}
#menu ul li span.nivel1 {display: block; }
#menu ul li:hover span.nivel1 {cursor: pointer;
}

#menu ul li:focus ul, #menu ul li:active ul {display: block;
position:absolute; width:816px; }
#menu ul li span a:hover, #menu ul li span a:focus, #menu ul li span a:active{ background-image:url(_css/_images/Fondo_Menu_Catalogo_Sel.gif); background-repeat:no-repeat; color:white; text-decoration:none;}

#menu ul li span a img{ border:none;}
#menu ul li:focus span a, #menu ul li:active span a{ background-image:url(_css/_images/Fondo_Menu_Catalogo_Sel.gif); background-repeat:no-repeat; color:white; text-decoration:none;}

[alexk]

Código CSS:

:focus{outline:0}
 

agrega lo anterior

[ramiguens]

Iniciado por alexk

Código CSS:

:focus{outline:0}
 

agrega lo anterior

De pleno, muchas gracias.