How to make a mobile version of the site?

Use
@media only screen and (max-width: 480px) { need styles }
for what would be the content of the site looked different. When increase and decrease the browser window, everything looks fine. Goes without problems, the styles are applied. But if I go to the phone, the site appears as on the computer. How to do that on the mobile site displayed exactly as I prescribed in my styles? Don't understand what I'm doing wrong.
July 2nd 19 at 18:27
3 answers
July 2nd 19 at 18:29
Solution
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

Add to head
Zoom only Express user.

While on the other hand, chrome now has a magic box which allows you to scale the sites even if banned. - Dexter_Jones commented on July 2nd 19 at 18:32
: I wrote a more detailed version of all - earline.Collins commented on July 2nd 19 at 18:35
July 2nd 19 at 18:31
this indicated?
<meta http-equiv="X-UA-Compatible" content="IE=edge">
 <meta name="viewport" content="width=device-width, initial-scale=1">
July 2nd 19 at 18:33
What's your resolution on the phone? It so happens that in the mobiles with high resolution, the browser takes the mobile screen for a desktop monitor.
If this is the problem, then view the solution here: "Cooking responsive website for Retina displays"

Find more questions by tags CSSHTMLJavaScript