Margin-top no para todo

[carlosuc99]

Buenas,

Tengo este css:

Código CSS:

.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;}
.nav > li {float:left; }
.nav li a:hover {background-color:#4db4fa;}
.nav li ul {display:none; position:absolute; min-width:140px;}
.nav li:hover > ul {display:block;}
.nav li ul li {position:relative;}
.nav li ul li ul {right:-140px;top:0px;}
 

Y este HTML:

Código HTML:

<ul class="nav">
                          <li><a href="index.php">Home Page</a></li>
                          <li><a href="./index_public.php?page=about_us">Sobre nosotros</a>
                            <ul class="nav2">
                            <li><a href="#nuevos">Nuevos</a></li>
                        <li><a href="#reacondicionados">Reacondicionados</a></li>
                        <li><a href="#cilindrados">Cilindrados a medida</a></li>
                        <li><a href="#compra">Compra de Tanques</a></li>
                        </ul>     </li>   
                        <li><a href="./index_public.php?page=pilots_public">Pilotos</a></li>
                          <li><a href="./index_public.php?page=fleet_public">Flota</a></li>
                          <li><a href="./index_public.php?page=contacts_form">Contacta</a></li>
                        </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.