construi un menu en css, obvio, solo una lista y es todo pero, he aqui donde viene el problema pues como siempre y por lo general internet explorer no lo muestra bien, asi que aqui les pongo las imagenes de como me lo muestra firefox y como lo hace internet exploter
FireFox
Internete Explorer
ahora aqui el codigo html que aisle de la pagina completa para saber si el comportamiento era ocacionado por algun otro elemento de la pagina principal
Código :
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Untitled Document</title> <link href="downMenu.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="downMenu"> <ul> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> <li><a href="#">Item</a></li> </ul> </div> </body> </html>
ahora aqui el css
Código :
#downMenu{ padding:0; text-align:center; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; background:url(downMenuBack.jpg) repeat-x top; height:20px; margin:10px auto 5px auto; width:700px; border:#CCC 1px solid; border-left:none; border-right:none; color:#666; } #menuContainer{ margin: 0 auto; } #downMenu ul{ list-style:none; margin: 3px 5px; } #downMenu ul li a{ width:70px; padding:1px; margin:0; color:#999; float:left; position:relative; text-decoration:none; display:block; } #downMenu ul li a:hover{ color:#666; background:#CCC; display:block; }
va eso es todo aver quien le hecha un ojo y me dice que es lo que estoy haciendo mal que seguro no es solo una cosa
hasta pronto