Click here to Skip to main content
15,943,168 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
Hi there!
I created a website and put it on a free hosting site to which I uploaded my files, and it appeared to me well on the computer, and when I minimized the width of the browser window, the response was good exactly as I designed it, but when I open the program on the mobile, the site is very bad and not as I designed it at all and the elements Overlapping ...
Likewise, when someone else opened the site for him on his Macintosh computer, he had errors that I do not have when I open the site from my computer, even though he has the same browser as I have, which is Chrome. My operating system is Windows 10.
What is the reason and what is the solution?
Note that I have provided the required formatting codes:
meta charset="UTF-8
meta lang="en-US
meta http-equiv="X-UA-Compatible" content="IE=edge
meta name="viewport" content="width=device-width,initial-scale=1.0
Please reply from people who have experience or any successful experience in raising a site on the Internet and its appearance well on the mobile, as well as who can point me to a source where I can find the solution.
Website link:
Thanks to any replies! Much appreciated.

What I have tried:

My website link:
Thanks to any replies! Much appreciated.
Updated 28-Apr-23 1:11am

1 solution

CSS media queries[^] are the solution for various screen dimensions.
Here's more in-depth guide on responsive design[^]
Share this answer

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900