All geek questions in one place

The Viewport tag does not work in Chrome.

I am using device metric overrides in Chrome to test a responsive website with lower resolutions (in this case 320x480).

The meta tag of my view does not affect the page in this case. The logo will seem tiny and I don’t read at all. More or less, I would say that I see everything on a scale of 0.5.

Here is the chapter of my HTML:

<!DOCTYPE html> <html> <head> <title>Title of the document</title> <link rel="stylesheet" href="css/main.css" /> <link rel="stylesheet" href="css/mediaqueries.css" /> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" / > <!--[if lte IE 8]> <style> .wrapper {min-width: 960px; padding: 0 10px;} .hovertext {background: #ccc;} </style> <![endif]--> <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/modernizr/modernizr-2.0.6-development-only.js"></script> <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> <script type="text/javascript" src="js/main.js"></script>

It works on other people's sites .... I don't know what I'm doing wrong ...

+4
source share
1 answer

Try this instead of the meta tag. Good luck.

 <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densityDpi=device-dpi" />
+7
source

Source: https://habr.com/ru/post/1468746/

More articles:


All Articles