HOW TO SET WIDTH FOR ALL SCREEN SIZES: Mobiles, Laptops, etc..

Question

Pls help me with this, am yet to see a satisfying answer to this question in previous discussions. I code with my laptop, but when I transfer them to the playground on my mobile, it squeeze my work and/or make them overlap. So I set a min-width, but this makes it somehow too large. The meta tag didn't work either. I have insert a code for an example.
Thanks in advance!

https://code.sololearn.com/WjGhnV0wAB5e/?ref=app

Answer 1

Use CSS media queries or use any framework to make your website responsive.

take a look at this discussion

https://www.sololearn.com/Discuss/210902/?ref=app

Answer 2

I think you need to design a grid system for your websites and some css media queries for different screen sizes.

Have a look at responsive design. This may give you some ideas.
https://www.w3schools.com/css/css_rwd_intro.asp

Answer 3

You can use media query to change its every style at different screen size

Answer 4

Ben thanks a lot also, I will check ✅ everything out

Answer 5

Soleyman thanks a lot bro 🙏

Answer 6

And if it don't change any time you can use !important to one of two values you prefer at that width