How do you make a webpage change its width automatically?

Question

In HTML, is there a way to make a webpage expand to the user\'s monitor? Like say I have a 15inch, but someone else has a 24 inch. The webpage would be small on their screen,

Answer 1

In a separate thread that was labeled as a duplicate, it asked how to automatically re-size your already responsive website to fit mobile screens. It didn't get an answer, and from what I can see here, this thread doesn't answer the question either.

Since I recently went through the same issue, I will share what I discovered.

For those using HTML5 to code their pages, in order for your page to be 'mobile friendly' you must add this code: <meta name=viewport content="width=device-width, initial-scale=1">. Some people are telling others to write it as <meta name=viewport content="width=device-width, initial-scale=1, user-scalable=yes">, but the user-scalable=yes is not necessary or needed. Every reputable how-to site I've visited, including the W3Schools.org site, that information is always left out. You don't need it.

If I leave the above code off of my pages, when I load them on my mobile, they automatically resize to fit the width of the screen. However, they then fail the Mobile-Friendly Test. If I insert the above code on my pages, I have to manually scale my pages down when I load them on my mobile. This was unacceptable to me. It should show the entire page and let the user scale upward, rather than the other way around.

The solution I found that satisfies both is this: <meta name=viewport content="width=device-width, initial-scale=0"> Not only does my site validate as 'mobile friendly,' but it also automatically resizes to fit the screen width on mobiles.

For those who have been searching for this solution for a while (at least the last 4 years from some of the dates I've seen for this question), and have yet to discover it, you're welcome!

Answer 2

Unless you explicitly set the size yourself, a page will default to using the full width of a browser window.

You might find Firefox's Web Developer plugin useful as it allows you to quickly change your browser's window to specific sizes so you can see how your layout looks at different sizes. https://addons.mozilla.org/en-US/firefox/addon/60