I make the site adaptive, for this I use media queries. 2 conditions are used: @media only screen and (max-width: 1020px) and (min-width: 600px) and @media only screen and (max-width: 599px) . So, on a smartphone with a resolution of 800 by 480 for some reason, the first condition works, i.e. Styles for screens with widths from 1020px to 600px are loaded, you need the second condition to work.

Explain how to fix it?

  • As far as I understand, you need the width of the workspace or something like that. - Vladimir Fedulkin

1 answer 1

I decided everything, add a line to html:

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