1

In Chrome, "localhost" is not responding to the global zoom.

In my Chrome browser, a page served from "localhost" has a different zoom than all other web-sites. Furthermore, use of "settings" to globally change the zoom percentage affects all sites except not "localhost". Interestingly, even "file://" responds to the global zoom, but the same set of files acts differently when served as "localhost".

I read something about Chrome switching things so what used to be 125% is now called 100%; can anyone confirm that? To me, it looks like "localhost" gets the old fashioned version of 100% (so, no extra 25% zoom).

I am using Chrome on a Mac.

By the way, this happens regardless of whether the following "meta" is included in the html section. The value of "initial-scale" has no affect.

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

My question is: Can I change the zoom of "localhost" so that either (a) it responds in sync with the global zoom, or (b) "localhost" is affected individually?

1 Answer 1

5

I figured it out. My mistake was that I had been ignoring a local zoom opportunity to get at the global zoom.

I was doing the following adjustment in Chrome; this sets the global zoom level:
(3 dot menu) -> Settings -> Appearance -> Page Zoom

The problem went away when I did the following simple thing; which sets zoom just for the current site: (3 dot menu) -> Zoom

Apparently, I had used that control on "localhost" months or years ago, and the value persisted until now. Apparently, a site that has had its "zoom" level changed in this "local" way will subsequently not react to changes at the "global" level.

3
  • interesting . Should a site be written/ created at 100% and enable user to reduce or expand to their preferences..or do devs set the %zoom for the user.?
    – Glen
    Apr 29, 2020 at 13:07
  • 1
    Zoom is not related to web page design. After your page has rendered, a person looking at the page and having impaired vision can magnify the page using zoom; this magnification does not affect layout. For all pages, the <meta> tag described by my original question should be included; this states that the device should apply its actual physical pixel width and height as the effective width and height. The page designer then uses responsive design to adapt a page to the various possibilities of width.
    – IAM_AL_X
    Apr 30, 2020 at 16:21
  • 1
    Lol I just got bit by this as well. I feel silly that I did not realize that Chrome persists the zoom level per hostname. To make matters worse it isn't unusual for me to accidentally zoom in/out with my mouse. :D
    – larandev
    Sep 7, 2020 at 15:36

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.