• Mensajes Argumentos
  • Recordar usuario
Entra a el MURO

No estás conectado. Conéctate o registrate

Ver el tema anterior Ver el tema siguiente Ir abajo Mensaje [Página 1 de 1.]

#1 Una ayudita con CSS :D el Vie Mar 18, 2011 10:55 pm
Hola a todos!! como van, bueno lo que pasa, es que estoy diseñando una página, y necesito una pequeña ayuda con css con un menu.
Bueno ps, el menu es horizontal y desplegable (pueden verlo aquí: [url=http://proyectos-multiples.com/beta ]http://proyectos-multiples.com/beta [/url] ), lo que yo deseo hacer es mover lo desplegable, quedaria algo asi:

El CSS del menu es el siguiente:
Código:
.pro_linedrop {
height:36px;
width:742px;
background:url(images/blank_sepia.gif);
position:relative;
font-family:arial, verdana, sans-serif;
font-size:12px;
z-index:500;
}

.pro_linedrop .select {
margin:0;
padding:0;
list-style:none;
white-space:nowrap;
}

.pro_linedrop li {
float:left;
background:url(images/blank_over_sepia.gif);
}

.pro_linedrop .select a {
display:block;
height:36px;
float:left;
background: url(images/blank_sepia.gif);
padding:0 0 0 15px;
text-decoration:none;
line-height:25px;
white-space:nowrap;
color:#ffffff;
}

.pro_linedrop .select li.line a {color:#fff;}

.pro_linedrop .select a b {
display:block;
padding:0 30px 10px 15px;
background:url(images/blank_sepia.gif) right top;
}

.pro_linedrop .select a:hover,
.pro_linedrop .select li:hover a {
background: url(images/blank_over_sepia.gif);
padding:0 0 0 15px;
line-height:27px;
cursor:pointer;
color:#e4e4e4;
}

.pro_linedrop .select li.line a:hover,
.pro_linedrop .select li.line:hover a {
color:#fff;}

.pro_linedrop .select a:hover b,
.pro_linedrop .select li:hover a b {
display:block;
padding:0 30px 9px 15px;
background:url(images/blank_over_sepia.gif) right top;
cursor:pointer;
}

.pro_linedrop .sub {
display:none;
}
.pro_linedrop ul ul {display:none;}

/* IE6 only */
.pro_linedrop table {
border-collapse:collapse;
margin:-1px;
font-size:1em;
width:0;
height:0;
}

.pro_linedrop .sub {
margin:0;
padding:0;
list-style:none;
}

.pro_linedrop .sub li {background:transparent;}

.pro_linedrop .select :hover .sub {
height:25px;
display:block;
position:absolute;
float:left;
width:740px;
top:28px;
left:0;
text-align:center;
background:#e8e8e8;
border:1px solid #aaa;
}

.pro_linedrop .select :hover .rt li {float:right;}

.pro_linedrop .select :hover .sub li a
{display:block; height:25px; line-height:22px; float:left; background:transparent url(images/transparent.gif); padding:0 16px; margin:0; white-space:nowrap; color:#888;font-size:11px;}

.pro_linedrop .select :hover .sub li.subline a {color:#0970e5;}

.pro_linedrop .select :hover .sub li a:hover,
.pro_linedrop .select :hover .sub li:hover
{color:#000; line-height:20px; position:relative;}

.pro_linedrop .select :hover .sub li:hover > a {color:#000;}

.pro_linedrop .select :hover .sub :hover ul {padding:0; margin:0; list-style:none; display:block; width:112px; position:absolute; left:-1px; top:25px; border:1px solid #aaa; border-top:0; background:#e8e8e8;}

.pro_linedrop .select :hover .sub :hover ul li a {width:80px; text-align:left; height:20px; line-height:18px;}
.pro_linedrop .select :hover .sub :hover ul li a:hover {line-height:16px;}


Gracias a todos :D

#2 Re: Una ayudita con CSS :D el Sáb Mar 19, 2011 7:50 pm
algunas respuestas :D, lo que quiero hacer esq en vez de desplegarze horizontalmente, lo haga verticalmente :)

Ver el tema anterior Ver el tema siguiente Volver arriba Mensaje [Página 1 de 1.]

Comparte este tema!

Url directa
BBcode
HTML

Ads

Permiso de este foro: No puedes responder a temas en este foro.

 

Promocionatupagina© Todos los derechos reservados.