Menu icon Foundation
Resolution messing up website

Website picture isnt following the word size. Like when you increase the screen resolution or use the browser zoom. The words get bigger and smaller. But the picture stays the same size. So when you zoom in the words go off the picture. Help?

resolutionwordspictures

Website picture isnt following the word size. Like when you increase the screen resolution or use the browser zoom. The words get bigger and smaller. But the picture stays the same size. So when you zoom in the words go off the picture. Help?

Rafi Benkual about 4 years ago

This is normal behavior of a webpage. Some users need larger text so they will zoom the screen.

The responsive meta tag starts the page at the users initial scale. If they zoom their browser it will increase the fonts size based on the base font size which is 16px by default.

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

You can use User-scalable=no but it is NOT recommended.

More info
http://blog.javierusobiaga.com/stop-using-the-viewport-tag-until-you-know-ho

Azmi Elqutob about 4 years ago

Is there a way to make the picture at least follow the words so it doesnt break my my website?

Rafi Benkual about 4 years ago

It's hard to say without seeing it. Do you have a link to the site so we can help more?

Rafi Benkual about 4 years ago

We really don't see any issues here. The image is working as expected. You can use position: fixed on the image if you want.