How to make a mobile responsive website?

Question

css

Good evening.
How do I set up the css code so that it displays correctly on all mobile devices?
Here's what I'm talking about. There are enough services that adjust your site to different resolutions, thereby testing adaptability. But there is a service ( tyk ), which not only adjusts the dimensions, but also, directly, opens your site on the specified software through (as I understand it) a virtual machine.
Therefore, when I open my site through this service, the screen of the emulated iPhone does not display my site, but only a stack of elements without css styling.

Answer 1

Check if you have it in html

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

or similar rule. This is necessary so that the styles react to conditions in media expressions.

Answer 2

Therefore, when I open my site through this service, the screen of the emulated iPhone does not display my site, but only a stack of elements without css styling.

In this very service, it is possible to look at the browser inspector and check if your styles have loaded.

Answer 3

Learn, learn adaptive layout. You need to know media queries, grid, floats, inline blocks, flexes.
https://m.youtube.com/watch?v=_g4NnnZdTxQ
https://m.youtube.com/watch?t=7s&v=Au6d1d-vFjU
If the markup is done correctly and the css is correctly distributed, then the adaptive itself is already easy to do.