problemas con CHROME y Div child

[BLAH !!]

Hola a todos tengo un menu desplegable hecho por divs,
el problema que tengo es que en google chrome solo funciona cuando quiere.

Al momento de poner el mouse encima para desplegar el menu, este aparece pero cuando muevo el mouse para selectar lo desplegado.... todo se desvanece (como si ubiese hecho mouse out.)


alguien sabe como solucionar este problema ?

[AngelKrak]

codigo amigo, seria bueno k pusieras el codigo jejeje xD

[BLAH !!]

MENU:

Código HTML:

 <nav>
            <ul class="sf-menu">
                <li class="current"><a href="index.php">Home</a></li>
                <li>
                    <a href="visita.php">Visita</a><ul>
                        <li><a href="visita.php#reservas">Reservas</a></li>
                        <li>
                        	<a href="visita.php#servicios">Servicios</a><ul>
                        		<li><a href="visita.php#tours">Tours</a></li>
                        		<li><a href="visita.php#eventos">Eventos</a></li>
                        	</ul>
                        </li>
                    </ul>
                </li>
                <li><a href="galeria.php">Galer&iacute;a</a></li>
                <li>
                    <a href="otro.php">Otro Link</a><ul>
                        <li><a href="descripcion.php">Descripci&oacute;n</a></li>
                        <li><a href="historia.php">Historia</a><ul>
                        		<li><a href="resena.php">Rese&ntilde;a</a></li>
                        		<li><a href="desarrollo.php">Desarrollo</a></li>
                        	</ul>
                        </li>
				        <li><a href="significado.php">Significado</a></li>
                    </ul>
                </li>

                <li><a href="otro2.php">Otro Link 2</a></li>
                <li><a href="contacto.php">Contacto</a></li>
            </ul>
        </nav> 

CSS:

Código:

.sf-menu{font-size:18px;line-height:1.2em;}
.sf-menu ul{position:absolute;top:-999em;width:148px;padding:6px;border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;box-shadow:0 0 5px rgba(0,0,0,.15);-moz-box-shadow:0 0 5px rgba(0,0,0,.15);-webkit-box-shadow:0 0 5px rgba(0,0,0,.15);
	background-color: #7b6f56;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#7b6f56), to(#59513e)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #7b6f56, #59513e); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(top, #7b6f56, #59513e); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #7b6f56, #59513e); /* IE10 */
	background-image:      -o-linear-gradient(top, #7b6f56, #59513e); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #7b6f56, #59513e);
}
.sf-menu ul ul{background:#3f392c;}
.sf-menu li:hover{visibility:inherit}
.sf-menu li{float:left;position:relative;}
.sf-menu a{color:#fff;text-decoration:none;display:block;white-space:nowrap;padding:18px 15px;}
.sf-menu li:hover ul,.sf-menu li.sfHover ul{left:-30px;top:59px;z-index:99;}
.sf-menu li:hover li ul,ul.sf-menu li.sfHover li ul{top:-999em}
.sf-menu li:hover,.sf-menu li.sfHover,.sf-menu li.current{box-shadow:0 0 5px rgba(0,0,0,.15);-moz-box-shadow:0 0 5px rgba(0,0,0,.15);-webkit-box-shadow:0 0 5px rgba(0,0,0,.15);border-radius:15px;-moz-border-radius:15px;-webkit-border-radius:15px;
	background-color: #cd4911;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#cd4911), to(#bb350d)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #cd4911, #bb350d); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(top, #cd4911, #bb350d); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #cd4911, #bb350d); /* IE10 */
	background-image:      -o-linear-gradient(top, #cd4911, #bb350d); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #cd4911, #bb350d);
}
.sf-menu li li:hover ul,ul.sf-menu li li.sfHover ul{left:148px;top:-6px;}
.sf-menu li li{float:none;margin-bottom:1px;}
.sf-menu li li:hover,.sf-menu li li.sfHover,.sf-menu li li.current{background:#443e32;border-radius:10px;-moz-border-radius:10px;-webkit-border-radius:10px;box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;}
.sf-menu li li li:hover,.sf-menu li li li.sfHover,.sf-menu li li li.current{background:#322e26;}
.sf-menu li li a{padding:6px 10px !important;}

[martinmiranda90]

Hola Blah!. He podido probar el código en navegadores y el problema a mi me sucede en ambos y creo que el problema es debido a un espacio que tienes entre el enlace y el submenu de primer nivel. Cuando le dices que estea visible solo cuando estes encima, el css se desactiva cuando intentas bajar y pones el cursor justo en el espacio.
Si lo pruebas de forma rápida no pasa ya que no lo de tiempo a asimilarlo.
Esta ha sido mi experiencia al menos en mi pc con Chrome.

Un saludo y espero poder haberte sido de ayuda.

[Zeromm]

El problema es el que dice martinmiranda90, tienes un espacio vacío entre el menú y el submenú, por lo tanto cuando vas a poner el ratón del menú al submenú, tienes que pasar por encima de ese espacio vacío y obviamente desaparece