initial view fits on screen?

[timaging]

Hi,

I’m starting a new site and it’s ok on desktop, but in portrait mode, the site doesn’t view the entire page, and I also can’t pinch and zoom at all.

I have height and width set to 100% in both and , hoping that would do it and it’s not working

anyone have an idea?

http://www.sciencebranding.com/site_2013/index.html

thanks-
Dave

[Paulie_D]

You have “minimum-scale=1.0” in your meta declaration in the head.

Could that be it?

[Paulie_D]

Try

That might do it.

[timaging]

Hi Paulie-

I just tried that and it didn’t appear to change anything. I can still see it ok in landscape, but not portrait. I can’t even pinch to zoom, which is the part that bothers me too-

http://www.sciencebranding.com/site_2013/index.html

thanks!!
Dave

[Paulie_D]

You still have ‘user-scalable = no’ set in that meta.

Try removing that.

[timaging]

well, it springs and bounces now, but it still doesn’t fit to width when you are in portrait mode.

thanks!!
Dave

[eatyourbrians]

If you were to scale to device width in portrait mode things might get pretty tiny if you’re viewing on mobile (which I’m guessing is the case if you’re talking about viewing in portrait). While not exactly the answer to your question, something to think about is using some percentage based widths and maybe some media queries to make your site a little responsive. Just a different, albeit more complicated approach to solving your problem.

-Brian

[timaging]

I hear ya but the client had a specific width in mind and didn’t want to go responsive, which I had originally suggested.

Maybe there’s a JavaScript solution since it doesn’t appear it can be handled with CSS or meta tags?

[Paulie_D]

>Maybe there’s a JavaScript solution since it doesn’t appear it can be handled with CSS or meta tags?

I don’t think this is going to help you.

Standard portrait mode is, what 768px? You can’t cram 1200+ fixed px into that.

Sounds to me as though mobile wasn’t a requirement for the client especially as they ‘didn’t want to go responsive’.

If mobile **was** a requirement then it sounds as though ‘mobile first’ might have been the best option.

[timaging]

I found the solution.

just gotta put in the total div width and it works.

Dave

[timaging]

[Author]

Posts