Responsive media query not working in Google Chrome
add this line in <head>
<meta name="viewport" content="width=device-width,initial-scale=1">
If you're using Chrome (or any browser) on a desktop, the browser zoom should be 100%. No more or no less. Otherwise, responsive doesn't work (use Ctrl + scroll in Windows, or Cmd +/- in Mac to adjust).
You can tweak this to your needs
// css for mobile here// .../* desktop */@media (min-width: 900px) and (orientation: landscape){ // css for desktop here // ...}
And don't forget
<meta name="viewport" content="width=device-width, initial-scale=1">