Foros del Web » Creando para Internet » CSS »

ayuda con menus css

Estas en el tema de ayuda con menus css en el foro de CSS en Foros del Web. hole estoy haciendo un menu desplegable que contenga mas menus pero no se como ponerlo horizontal para empezar Código HTML: <div id= "menud" > <ul> ...
  #1 (permalink)  
Antiguo 04/06/2009, 18:11
 
Fecha de Ingreso: mayo-2008
Mensajes: 499
Antigüedad: 9 años, 7 meses
Puntos: 1
ayuda con menus css

hole estoy haciendo un menu desplegable que contenga mas menus pero no se como ponerlo horizontal para empezar

Código HTML:
 <div id="menud">
      <ul>
        <li class="level first"> <a href="" class="level">Inicio</a>
          <!--[if lte IE 6]><a href="" class="levelie">Inicio<table class="false"><tr><td><![endif]-->
          <ul>
            <li class="first" ><a href="">Axess</a></li>
            <li><a href="">once</a>
              <ul>
                <li class="first"><a href="">twice</a></li>
              </ul>
            </li>
          </ul>
          <!--ìf lte IE 6]></td></tr></table></a><![endif]-->
        </li>
        <li class="level"> <a href="" class="level">Inicio</a>
          <!--[if lte IE 6]><a href="" class="levelie">Inicio<table class="false"><tr><td><![endif]-->
          <ul>
            <li class="first" ><a href="">Axess</a></li>
            <li><a href="">once</a></li>
          </ul>
          <!--ìf lte IE 6]></td></tr></table></a><![endif]-->
        </li>
      </ul>
    </div> 
css
Código HTML:
#menud{
	text-align:center;
	font-size: 0.8em;
	width:155px;
	margin:1px auto;
}

#menud ul{
	list-style-type: none;
}
#menud ul li.level{
	float: left;
	width: 155px;
	margin-right:2px;
}
#menud ul li a{
	display:block;
	text-decoration:none;
	font-size:17px;
	color:#000;
	border:solid 0px #fff;
	padding:6px;
	position:relative;
}
#menud ul li:hover{
	position:relative;
}
#menud ul li a:hover,
#menud ul li:hover a.level{
	color:#FFF;
	background-color:#000;
	border-bottom:2px solid #F00;
	position:relative;
}
#menud ul li a.level{
	display:block!important;
	display:none;
	position: relative;
}
#menud ul li ul{
	display:none;
}
#menud ul li a:hover ul,
#menud ul li:hover ul{
	display:block;
	position: absolute;
	left:0px;
}
#menud ul li ul li a{
	width:155px;
	padding:5px 0px 5px 0px;
	border-top-color:#000;
}
#menud ul li ul li a:hover{
	border-top-color:#000;
	position:relative;
}
table.false{
	border-collapse:collapse;
	border:0px;
	float:left;
	position: relative;
}

  #2 (permalink)  
Antiguo 04/06/2009, 18:18
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: ayuda con menus css

si #menud tiene una anchura que es igual a la de cada #menud ul li es dificil de colocar 2 ó más li en horizontal.

Amplía el tamaño de esa caja (o mejor, no le marques anchura si eso no te descuadra otras cosas)

Pásate por las faq´s, Mikmoro tiene una buena colección de menús que te podrán servir de guía.
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 01:31.