Ver Mensaje Individual
  #7 (permalink)  
Antiguo 31/07/2014, 04:21
Avatar de seozeta
seozeta
 
Fecha de Ingreso: junio-2013
Mensajes: 98
Antigüedad: 10 años, 10 meses
Puntos: 66
Respuesta: Problema con diseño responsive en Internet Explorer

Cita:
Iniciado por danidg86 Ver Mensaje
Muchisimas gracias a los dos.

¿Me recomiendan el uso del fix respond.js para que las media-queries funcionen en IE 8 y hacia detras?

Y respecto a los mediaqueries, ¿deben ser esos que me da en concreto? ¿por que ha elegido esos?


Yo he tomado estos, que me dieron como modelo en mi formacion:


Código CSS:
Ver original
  1. @media screen and (min-width: 1001px)
  2.  
  3. @media screen and (max-width:1000px)
  4.  
  5. @media screen and (max-width:710px), screen and (max-device-width:480px)
  6.  
  7. @media screen and (max-width:370px)


¿Son correctos? Estrechando el scroll del navegador en un ordenador de mesa, funcionan.

¿Es posible que la pagina no se abra en un dispositivo movil por algun error en ellos? Como digo, en un movil Samsung de pantalla estrecha de mi jefe salio el texto plano, como si no "entrara" a los estilos css.

Muchas gracias.
Para que te funcionen los @media queries en IE8 o versiones inferiores es suficiente con poner esto en el head:

Código HTML:
Ver original
  1. <!--[if lt IE 9]>
  2.    <script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
  3. <![endif]-->

Los @media queries que te pasé era con el objetivo de que los compares con los tuyos y así poder analizar si tenías algo mal. Los anchos son lo de menos, ahí ya cada uno tendrá su propio esquema.

(Mi esquema se basa en las medidas estándard de dispositivos móviles: 320px, 480px, 768px, 1024px... Además los uso en dos fases: todo lo que tenga que ser inferior a 768px, por ejemplo, en uno, y lo que sea únicamente entre 480px y 768px en otro. Y así con cada rango. Pero eso ya va a gustos. Tu esquema me parece bien, lo importante es que cumpla con la solución que deseas implementar).