Tema: menu desplegable horizintal a la izquierda
Ver Mensaje Individual
  #3 (permalink)  
Antiguo 30/06/2014, 11:49
jakijem
 
Fecha de Ingreso: septiembre-2013
Mensajes: 60
Antigüedad: 10 años, 7 meses
Puntos: 1
Respuesta: menu desplegable horizintal a la izquierda
no entiendo nada, te pongo mi codigo por msi puedes ayudarme:

HTML:

Código HTML: 
Ver original
  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Documento sin título</title>
  6. <link href="css/estilos.css" rel="stylesheet" type="text/css">
  7. </head>
  8.  
  9. <body>
  10. <nav id="language">
  11.         <ul class="navlan">
  12.             <li ><a href="">ENGLISH</a>
  13.                 <ul>
  14.                     <li><a href="">FRANCAISE</a></li>
  15.                     <li><a href="">ESPAÑOL</a></li>
  16.                     <li><a href="">ITALIANO</a></li>
  17.                     <li><a href="">ARABIC</a></li>
  18.                     <li><a href="">RUSSIAN</a></li>
  19.                 </ul>
  20.             </li>
  21.         </ul>
  22.       </nav>
  23. </body>
  24. </html>


CSS:

Cita:


#language {
text-align: center;
width: 80px;
font: 1.2em;
line-height: 1em;
min-height: 42px;
position: absolute;
right: 15.867093%;
text-align: left;
top: 0px;
height: 23px;
left: 65%;
}

/* menu idiomas dropdown*/
/* =================== */

nav .navlan ul {
color:#000;
padding:0;
margin:0;
list-style: none;
position: relative;
display:inline;
}

nav .navlan ul li {
float:left;
display:inline;
list-style: none;

}

nav .navlan ul li a {
display:inline;
font-size:16px;
text-decoration:none;
font-family: 'Nilland';
}

.navlan li a:hover {font-weight:Bold; }


/* Estilos del dropdown */


/* Oculta Dropdowns por defecto */
nav .navlan ul ul {
display: none;
position: absolute; top: 28px;
}

/* Muestra Dropdowns on Hover */
nav .navlan ul li:hover > ul {
/*display:list-item;*/
display: inline;
padding:0;
margin:0;
}

/* primer descendiente Dropdown */
nav .navlan ul ul li {
width:170px;
float:none;
position: relative;
border-bottom:none;
}

/* Segundo, tercero y siguientes descendientes */
nav .navlan ul ul ul li {
position: absolute relative;
top:-24px;
left:170px;
}

/* flechitas del elemento que tiene dropdown */
.navlan li > a:after { content: ' <'; }
.navlan li > a:only-child:after { content: ''; }