1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

initial-scale=2 bug

Discussion in 'HTML & Website Design' started by Robert Norgren, Feb 24, 2017.

  1. #1
    Hi all!
    I've been working a little on my portfolio site http://www.robertnorgren.com/

    To target mobile I've used the line "<meta name="viewport" content="width=device-width, initial-scale=2">". But, when I enter the site on mobile everything's really big until snapping to the expected smaller type.

    Is there a way to have it load the correct smaller type instantly, or is there another fix you'd recommend?

    Any ideas? Much appreciated.
    Robert Norgren, Feb 24, 2017 IP
  2. qwikad.com

    qwikad.com Illustrious Member Affiliate Manager

    Likes Received:
    Best Answers:
    Trophy Points:
    Try this instead:

    <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, user-scalable=yes">
    Code (markup):
    qwikad.com, Feb 24, 2017 IP
  3. deathshadow

    deathshadow Acclaimed Member

    Likes Received:
    Best Answers:
    Trophy Points:
    Yeah, setting it to two is a REALLY bad idea. What @qwikad.com suggested is better, though I suggest NOT screwing with minimum-scale, and user-scalable="yes" is the default behavior so...

    Also, when rotated to portrait some Android devices report their device-height as width, so I suggest:

    <meta name="viewport" content="width=device-width,height=device-height,initial-scale=1">
    Code (markup):
    I don't know who suggested an initial-scale=2, but that's, well... going to do pretty much what you described. Only thing I can figure is there are deeper rooted issues in your layout like some artists under the DELUSION they know what design is -- or front-end coder not qualified to write HTML/CSS -- or a combination of the two -- went and declared all your flow text and elements in 'px' instead of the more accessible 'em' measurement.

    Though beware that as of recent changes to OSX, you know have a decision to make over whether to say "screw retina display laptop/desktop users" or "screw Android HDX display users" in regards to font scaling. Fun times.
    deathshadow, Feb 24, 2017 IP