@media query not working in mobile. Works fine in Chrome

Question

I am trying to get this working but somehow its not working in mobile. when i use chrome tool to overrides the screen size, it works fine. i am not sure what i am doing wron

Answer 1

I know this is an old post, but I recently had an issue like this. I ended up fixing it by removing the CSS media query from the main CSS stylesheet, and entering the specific needs for mobile on the html style section instead. Don't know why it worked, but it did.

Answer 2

@Andy is right, double check your device-widths, or you could always just use min-width so you don't have to know every device width.

Regardless make sure you have a viewport tag, like <meta name="viewport" content="width=device-width,initial-scale=1.0">.

Answer 3

Fantastic - forgot the viewport too! Fot all: Just add

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

in your head