1

Tengo una página responsive, supuestamente, porque mientras que en la pantalla del ordenador, al redimensionar me lo muestra bien, al abrirlo con un dispositivo de pantalla pequeña (menor de 500px de ancho) no funciona. Os adjunto el meta que tengo puesto y como están las queries:

HTML:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

CSS:

@media only screen and (min-width: 501px){......}
@media only screen and (max-width: 501px){......}

Enlace a la web

7
  • Tienes puesto min-width: 501px por bajo de ese ancho no funcionaran las instrucciones que tengas asociadas el 2 jun. 2017 a las 10:19
  • Cuando puedas, te recomiendo que revises esta pregunta: CSS: ¿Qué son los media queries, para qué sirven, cómo se agrupan y cómo implementarlos? y su respuesta.
    – A. Cedano
    el 2 jun. 2017 a las 11:42
  • Intenta añadir un ejemplo completo y verificable para tu pregunta, por muy simplificado que sea. De ese modo será más fácil encontrar el error.
    – Alex
    el 2 jun. 2017 a las 11:45
  • he añadido el enlace de donde lo podéis ver
    – Gema
    el 2 jun. 2017 a las 12:09
  • 1
    En la página tienes dos veces el viewport: <meta name="viewport" content="width=device-width, initial-scale=1.0"> y luego, el que se aplica es éste, porque aparece último: <meta name="viewport" content="width=960">. También si es posible, prueba con dos versiones de navegador distintas en el dispositivo móvil.
    – A. Cedano
    el 2 jun. 2017 a las 13:13

1 respuesta 1

1

En la etiqueta meta usa esto:

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

y si estas empezando desde mobile a desktop utiliza esto:

@media screen and (min-width: 501px) {
       /* Tus Estilos */
}

Espero te sirva.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.