I’m trying to understand what the viewport
meta tag achieves and from what I could understand browsers normally (in the absence of a viewport meta tag) scale content size to fit all content on the available display area (up to 800px) with the result that content designed to be displayed on larger view areas might force to a zoom-in/zoom-out experience on smaller devices when reading text.
With the viewport
meta tag you are telling the browser to stop scaling content to fit the document display area and this because you probably want to manage what (and how) will be displayed at the different view area sizes by implementing an appropriate responsive design and, if you do not, the result will probably be that of an horizontal scrollbar being displayed on smaller display areas.
What I’m not yet getting is what is being controlled by setting the viewport’s width
attribute not to device-width
but to a smaller fixed value. I’ve tried setting it to some smaller values and I expected to somehow see some visual change in the rendering of my responsive website but I don’t seem to see any changes.