Comunidad de diseño web y desarrollo en internet online

una lista aparte

Citar            
MensajeEscrito el 04 Abr 2006 05:12 am
hey buen dia clab, pues bien aqui otro problemita.
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 :lol:
hasta pronto

Por jaimoco

299 de clabLevel



Genero:Masculino  

choya bay , mexico

firefox
Citar            
MensajeEscrito el 04 Abr 2006 05:20 am
no compliques tanto la cosa; a los elementos li de la lista dales un display:inline, no los flotes y no los posiciones relativamente, con eso debe andar.
recuerda que mientras haces tu código css ve checándolo con ambos navegadores, así te ahorras mucho tiempo

Por fael

BOFH

2443 de clabLevel

3 tutoriales
2 articulos

 

firefox
Citar            
MensajeEscrito el 04 Abr 2006 06:58 am
va gracias, de hecho con eso andubo pero tuve que cambiar mucho el codigo :lol: pero bien gracias por la ayuda y pues aqui dejo el codigo por si a alguien le sirve.

html

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="menuContainer">   
   <ul id="downMenu"> 
     <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>


css

Código :

body{
text-align:center;
}
#menuContainer{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
width:700px;
margin:auto;
padding:0;
background:url(/images/downMenuBack.jpg) repeat-x top;
border-bottom:#CCCCCC 1px solid;
border-top:#CCCCCC 1px solid;
}
#downMenu{
list-style:none;
height:16px;
margin:0;
padding-top:3px;
}
#downMenu li{
display:inline;
margin:auto 5px auto 5px;
}

#downMenu li a{
display:inline;
color:#999999;
text-decoration:none;
}
#downMenu li a:hover{
color:#666;
background:#EAEAEA;
}

sale.

Por jaimoco

299 de clabLevel



Genero:Masculino  

choya bay , mexico

firefox
Citar            
MensajeEscrito el 04 Abr 2006 01:27 pm
Entonces.. ¿Lo que querias era un menu 100% horizontal? A mi me gustó mucho ese "menú raro" como si fuera por divisiones, muy c00l.

Por NEO_JP

BOFH

5724 de clabLevel

13 tutoriales
12 articulos

Genero:Masculino   Anime Bloggers Premio_Secretos Team Cristalab

Front-end Developer en Washington, DC

firefox
Citar            
MensajeEscrito el 05 Abr 2006 08:18 am
Si jaja solo queria un menu horizontal no se porque lo maneje de esa forma mas dificil creo que me fui por la maquetacion de un dropdown pero sin los submenus, CristalCanabis, tu sabes....

Por jaimoco

299 de clabLevel



Genero:Masculino  

choya bay , mexico

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.