Ver Mensaje Individual
  #1 (permalink)  
Antiguo 08/03/2013, 06:28
Avatar de madman_18
madman_18
 
Fecha de Ingreso: agosto-2010
Mensajes: 792
Antigüedad: 14 años, 3 meses
Puntos: 14
Exclamación Problema con responsive design para medidas de IPAD

Hola a todos.

Estoy mirando el diseño de mi página web, y tengo un "problema" en el diseño cuando se visualiza desde un ipad.

He revisado todos los elementos y ninguno tiene un tamaño exagerado ni nada sin embargo cuando lo visualizo siempre me aparece el scroll para desplazarme horizontalmente y no sé por qué.

os pongo todo mi CSS porque ya no sé qué mirar...

Código CSS:
Ver original
  1. /* CONTENEDORES Y CONTENIDOS ================================================ */
  2. #contenedor{width:100%;height: auto;min-height:100%;position:absolute;top:0px;}
  3. #texto-seccion{width:50%;height: 100%;position:absolute;left:0;top:0;float:left;z-index: 90;background: #0C3C1A;
  4.                font-family: 'Handlee', san-serif;
  5.                transform:skew(-32deg, 0deg);
  6.                -moz-transform:skew(-32deg, 0deg);-webkit-transform: skew(-32deg, 0deg);
  7.                -ms-transform: skew(-32deg, 0deg);-o-transform: skew(-32deg, 0deg);
  8. }
  9. #configura-texto{width:100%;height:auto;position:relative;top:60px;
  10.                  transform:skew(32deg, 0deg);
  11.                 -moz-transform:skew(32deg, 0deg);-webkit-transform: skew(32deg, 0deg);
  12.                 -ms-transform: skew(32deg, 0deg);-o-transform: skew(32deg, 0deg);
  13. }
  14. #titulo-parrafo{width:100%;height:auto;margin:0 auto;text-align: right;font-size: 32pt;padding-bottom: 5px;border-bottom: 2px solid #C0D103;}
  15. #primer-bloque,#segundo-bloque,#tercer-bloque{width:65%;height:auto;position:relative;left:20px;margin:0 auto;padding: 10px 0 10px 0;}
  16. #primer-bloque{padding-top: 15px;}
  17.  
  18. @media screen and (max-width:768px){    
  19.     #texto-seccion{width:60%;}
  20.     #nav{font-size: 10pt;}
  21.     #titulo-parrafo{width:100%;position:relative;left:0px;}
  22.     #configura-texto{left:0;transform:skew(0deg, 0deg);background:none !important;
  23.                      -moz-transform:skew(32deg, 0deg);-webkit-transform: skew(32deg, 0deg);
  24.                      -ms-transform: skew(32deg, 0deg);-o-transform: skew(32deg, 0deg);
  25.     }
  26.     #primer-bloque{display:block;width:65%;height:auto;position:relative;left:20px;margin:0 auto;padding: 10px 0 10px 0;background:none;}
  27.     #segundo-bloque{display:block;width:70%;height:auto;position:relative;left:40px;margin:0 auto;padding: 40px 0 10px 0;font-size: 10pt;}  
  28.     #galeria-fotos,#galeria-fotosProd{margin-top:-50px;}
  29.     .tabla-contacto{left:90px;}
  30.     #comentarios{width:100px !important;}  
  31.     #mapa-contacto{width:70%;right:0 !important;}
  32. }

Gracias por vuestra ayuda!
__________________
"Si consigues ser algo más que un hombre, si te entregas a un ideal, te convertes en algo muy diferente"