Imprimir Página - Los media queries no funcionan con los valores definidos

Hola, estoy haciendo mi web responsive con media queries, y es un problema pequeño pero que no sé solucionarlo. Yo pongo:

Código:

@media screen and (max-width:768px){
 code...
}

Pero no me lo arranca bien, en este código lo que le digo es que si el ancho de mi pantalla es menor ( con max-width) de 768px me va a cambiar los estilos, eso es para tablets, también lo tengo en JS:

Código:

$(document).ready(function(){
 if(window.matchMedia("(max-width: 768px)").matches){
   code...
 }
});

Y para móviles que si la pantalla es menor que 600px me va a cambiar los estilos y JS:

Código:

@media screen and (max-width:600px){
 code...
}

Código:

$(document).ready(function(){
 if(window.matchMedia("(max-width: 600px)").matches){
   code...
 }
});

Esta manera no me arranca es decir que cuando yo pongo la pantalla a 768px (modo tablet) no me ejecuta los códigos (mi tablet la anchura es exacto 768px), pero si me ejecuta si la anchura es a partir de 691px, y modo movil a partir de 540px cuando yo lo progrmé para:

movil---> 600px
tablet---> 768px

Mi tablet es un Surface Pro y no he probado otras tablets.. Hi antes me iba bien, me lo ejecutaba perfectamente.

Porque me pasó esto que error hay, y en su tablet y moviles de 600px de anchura se ven bien?

Gracias.

Hola.
Es difícil responderte si no vemos el código. Si tienes la web online y quieres pasarnos el link para que lo nosotros lo comprobemos porque el código que escribes debería funcionar. La mejor forma es que inspecciones el código, por ejemplo, desde Firefox y observes en vista responsive si el código actúa o no.

También te puede servir de ayuda validar tu archivo CSS, un simple punto y coma puede hacer que tu estilo no se ejecute correctamente... https://jigsaw.w3.org/css-validator/ (https://jigsaw.w3.org/css-validator/)

Un saludo

Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: Drakaris en 14 Septiembre 2017, 18:21 pm