Ver Mensaje Individual
  #5 (permalink)  
Antiguo 18/11/2012, 21:14
benllycast
 
Fecha de Ingreso: noviembre-2012
Ubicación: el norte del sur
Mensajes: 3
Antigüedad: 12 años
Puntos: 0
Respuesta: Problema con efecto de menu,

Hola moro666

gracias por tu ayuda

ya pude solucionar el problema aplicando un margin negativo a los elementos del menu
aqui esta parete de la solucion si alguna ves tiene el mismo problema.

Código CSS:
Ver original
  1. #left-sidebar ul{
  2.                     display: inline-block;
  3.                     padding: 1.7em 0 1.7em 0.2em;
  4.                 }
  5.                 #left-sidebar ul li{
  6.                     list-style-type: none;                 
  7.                     background: -webkit-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
  8.                     background: -moz-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
  9.                     background: -o-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
  10.                     background: -ms-linear-gradient(top, #1e5799 0%,#2989d8 50%,#207cca 51%,#7db9e8 100%);
  11.                     margin-top: -10px;
  12.                     padding: 10px 5px;
  13.                     width: 85px;
  14.                     position: relative;
  15.                     border: 1px solid black;
  16.                     border-radius: 10px 0;
  17.                     box-shadow: -3px -3px 1px #aaa;
  18.                     opacity: 0.8;
  19.                     transform: skew(-6deg,-15deg);
  20.                     -ms-transform: skew(-6deg,-15deg);
  21.                     -webkit-transform: skew(-6deg,-15deg);
  22.                     -o-transform: skew(-6deg,-15deg);
  23.                     -moz-transform: skewX(-6deg) skewY(-15deg);
  24.                 }
  25.  
  26.                 #left-sidebar ul li:hover{
  27.                     font: bold 1em arial;
  28.                     text-shadow: -1px -1px 2px #000;
  29.                     -webkit-text-shadow: -1px -1px 2px #000;
  30.                     -moz-text-shadow: -1px -1px 2px #000;
  31.                     -o-text-shadow: -1px -1px 2px #000;
  32.                     -ms-text-shadow: -1px -1px 2px #000;
  33.                     opacity: 1;
  34.                     margin-top: -20px;
  35.                     margin-bottom: 10px;
  36.                 }
  37.  
  38.                 #left-sidebar ul li a{
  39.                     font: bold 1em arial;
  40.                     text-decoration: none;
  41.                     width: 100%;
  42.                     height: 100%;
  43.                     color: white;
  44.                 }
  45.                 #left-sidebar ul li a:hover{
  46.                     text-shadow: -1px -1px 2px #000;
  47.                 }