Ver Mensaje Individual
  #1 (permalink)  
Antiguo 11/07/2013, 10:18
Avatar de jibran
jibran
 
Fecha de Ingreso: mayo-2011
Ubicación: Estado de Mexico
Mensajes: 27
Antigüedad: 13 años
Puntos: 0
Submenu con orientacion automatica

He desarrollado un menu sencillo con css y mi problema radica en que el ultimo elemento de la lista principal contiene un submenu con 2 niveles secundarios.

Al desplñegar los elementos estos aparecen a la derecha y llega el punto en que no caben en el tamaño original del body provocando la apricion de los scrolls..

Lo que quiero hacer es que en dependecia del ancho del body el submenu se posicine del lado derecho u izquierdo segun sea necedsario para no salr del ancho del body

adjunto codigo css


Código CSS:
Ver original
  1. * {
  2. font-family:sans-serif;
  3. list-style:none;
  4. list-style-type: none;
  5. text-decoration:none;
  6. margin:0;
  7. padding:0;
  8. }
  9.  
  10. .nav > li {
  11. float:left;
  12. }
  13.  
  14. .nav li a {
  15. background: navy;
  16. color: white;
  17. display:block;
  18. border:1px solid;
  19.  
  20. padding:10px 12px;
  21. font-size: 14px;
  22. }
  23.  
  24. .nav li a:hover {
  25. background: darkslateblue;
  26. text-decoration: underline;
  27. font-style: oblique;
  28. font-weight: bold;
  29. }
  30. .nav li ul {
  31. display:none;
  32. position:absolute;
  33. min-width:160px;
  34. }
  35.  
  36. .nav li:hover > ul {
  37. display:block;
  38.  
  39. }
  40.  
  41. .nav li ul li {
  42. position:relative;
  43. }
  44.  
  45. .nav li ul li ul {
  46. right:-160px;
  47. top:0;
  48. }