Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Viewport meta tag - device width doesn't work

I want my site witch isn't ready for mobile to open on the whole page like in the example in the right side of the image below.

Currently It's looks like the example on the left size and I can't make it work the way I want.

Whe width of the site is 1020 and I use the viewport meta tags like:

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

But it doesn't work and I never see this work on mt device.

Any idea how I can make it open the way I want it to open? (Zoomed out)

Zoom problem

like image 858
Matan G. Avatar asked Oct 29 '25 05:10

Matan G.


2 Answers

If your website is not mobile friendly you should not enter initial-scale value, or remove meta viewport and you website should look as you want.

Solution 1:

Remove <meta name="viewport">. However I would not recommend this, because default viewport width on different devices is different, and your website will probably lose margins.

Solution 2:

Specify only width in <meta name="viewport">, like this: <meta name="viewport" content="width=1020">, this will make your website look "zoomed out" in the right way on all devices.

like image 116
John Avatar answered Oct 30 '25 18:10

John


Remove viewport meta tag , if your site is not mobile friendly. It will occupy whole screen as shown in right side image

like image 40
UnmeshD Avatar answered Oct 30 '25 18:10

UnmeshD