Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Margin-top no para todo

Estas en el tema de Margin-top no para todo en el foro de CSS en Foros del Web. Buenas, Tengo este css: @import url("http://static.forosdelweb.com/clientscript/vbulletin_css/geshi.css"); Código CSS: Ver original .nav li a { background-color : #000 ; width : 100px ; color : #fff ...
  #1 (permalink)  
Antiguo 01/07/2013, 16:54
 
Fecha de Ingreso: junio-2011
Mensajes: 342
Antigüedad: 13 años, 4 meses
Puntos: 5
Exclamación Margin-top no para todo

Buenas,

Tengo este css:

Código CSS:
Ver original
  1. .nav li a {background-color:#000;width:100px;color:#fff;text-decoration:none; font-size:16px;text-align:center;margin-top:1px; margin-left:10px;padding:1px 15px 15px;display:block;}
  2. .nav > li {float:left; }
  3. .nav li a:hover {background-color:#4db4fa;}
  4. .nav li ul {display:none; position:absolute; min-width:140px;}
  5. .nav li:hover > ul {display:block;}
  6. .nav li ul li {position:relative;}
  7. .nav li ul li ul {right:-140px;top:0px;}

Y este HTML:

Código HTML:
Ver original
  1. <ul class="nav">
  2.                           <li><a href="index.php">Home Page</a></li>
  3.                           <li><a href="./index_public.php?page=about_us">Sobre nosotros</a>
  4.                             <ul class="nav2">
  5.                             <li><a href="#nuevos">Nuevos</a></li>
  6.                         <li><a href="#reacondicionados">Reacondicionados</a></li>
  7.                         <li><a href="#cilindrados">Cilindrados a medida</a></li>
  8.                         <li><a href="#compra">Compra de Tanques</a></li>
  9.                         </ul>     </li>  
  10.                         <li><a href="./index_public.php?page=pilots_public">Pilotos</a></li>
  11.                           <li><a href="./index_public.php?page=fleet_public">Flota</a></li>
  12.                           <li><a href="./index_public.php?page=contacts_form">Contacta</a></li>
  13.                         </ul>

Es un drop-down menú. Lo que pasa es que no quiere que me aplique el margin-top a los menús que se despliegan porque se separan las celdas. Sólo quiere que se aplique con respecto a la parte superior de la página.

Quiero que se mire separado de la parte alta de la página pero que a la vez cuando pulso Sobre Nosotros, las celdas del dropdown menú estén juntas.

Si lo hago de esta manera el margin-top se aplica con respecto a la parte de arriba de la página pero también hacer que las celdas del dropdown se separen dejando un hueco blanco entre ellas.
  #2 (permalink)  
Antiguo 01/07/2013, 17:04
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.489
Antigüedad: 22 años, 3 meses
Puntos: 2114
Respuesta: Margin-top no para todo

El problema realmente lo tienes en los selectores, porque todo lo que pongas en .nav li a, se va a aplicar a los enlaces de los submenus.

Entonces tendrías que reajustar ese margen:

Código CSS:
Ver original
  1. .nav li ul li a {
  2.   margin-top: 0;
  3. }

Etiquetas: hover, margin-top
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 12:50.