Problemas menu css internet explorer 9

koloinotzente · #1 (**permalink**) 01/02/2012, 20:32

Que tal amigos de foro del web:

tengo un problema con un menu que usa css en internet explorer 9 y es que no despliega las subopciones . funciona para chrome y mozilla pero no para internet explorer 9.

el codigo del css es el siguiente:

Código:

.time {behavior: url(#default#time2)}
#menu {width:750px; height:30px; background:transparent; border-bottom:0 px solid #aaa;}

#menu ul {margin:0; padding:0; list-style:none; white-space:nowrap; text-align:left;}
#menu ul {float:left;} 

#menu li {display:inline-block; display:inline;}
#menu ul ul {position:absolute; display:none; left:0; top:30px; border:1px solid #aaa;}
#menu ul.level1 li.level1-li {float:left; display:block; position:relative;}

#menu ul {background:#000;}

#menu span,
#menu a {display:block; font:bold 12px arial,sans-serif; color:#fff; line-height:30px; text-decoration:none; padding:0 10px 0 20px; border-left:1px solid #aaa;}
#menu ul ul a {border:0;}

#menu ul.level1 li.level1-li a.level1-a {float:left;}

#menu ul li:hover ul {display:block;}

#menu li:hover {background:#aaa; color:#000; cursor:default;}
#menu a:hover {background:#aaa url(../img/arrowright.png) no-repeat 3px center; color:#000;}
#menu li:hover > a,
#menu li:hover > span {background:#aaa url(../img/arrowright.png) no-repeat 3px center; color:#000;}

y el de html es el siguiente:

Código:

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" href="menusub.css" type="text/css">
<div id="menu">
	<ul class="level1">
		<li class="level1-li" id="a1"><a class="level1-a" href="#url">Home</a></li>
		<li class="level1-li" id="s1"><span><a class="level1-a" href="#url">Contact Us</a></span>

			<ul class="time" begin="s1.mouseenter" end="s1.mouseleave"  timeaction="display">
				<li><a href="#url">Email</a></li>
				<li><a href="#url">Telephone</a></li>
				<li><a href="#url">Online Form</a></li>
				<li><a href="#url">Snail Mail Address</a></li>
			</ul>
		</li>

		<li class="level1-li" id="s2"><span>Resort</span>
			
		</li>
		<li class="level1-li" id="s3"><span>Surrounding Area</span>
			
		</li>
		<li class="level1-li" id="s4"><span>Information</span>
			
		</li>
		<li class="level1-li" id="a2"><a class="level1-a" href="#url">Privacy</a></li>
        <li class="level1-li" id="a2"><a class="level1-a" href="#url"><img src="../img/salir.png" alt="esp"  border="0" /></a></li>

	</ul>
</div>

les agradezco mucho si me pueden ayudar.
saludos.

geovah · #2 (**permalink**) 24/12/2012, 10:35

La verdad hasta el dia de hoy ingrese al foro, supongo que ya encontraste una solución, la verdad a mi también me estuvo dando problemas IE en todas sus versiones, solamente le heche un vistazo a tu codigo, la unica solucion para mi por el momento fue ingresar en la cabecera de mi documento trabajando con un menu y codigo css lo siguiente:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

al parecer IE9 acepta muy bien codigo css desplegable cuando trabaja con xhtml, por cierto si trabajas con tablas el contenido te lo mostrará centrado, tendras que arregar un poco tu codigo mediante css y justificar a alinear los textos o cualquier cosa que tengas en tablas lo demas te va bien, si aún te sirve prueba un poco esto.

Espero haber sido de ayuda,