Grow your CSS skills. Land your dream job.

initial view fits on screen?

  • # March 1, 2013 at 11:10 am

    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

    # March 1, 2013 at 11:34 am

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

    Could that be it?

    # March 1, 2013 at 11:36 am

    Try

    That might do it.

    # March 1, 2013 at 2:11 pm

    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

    # March 1, 2013 at 3:02 pm

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

    Try removing that.

    # March 1, 2013 at 3:29 pm

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

    thanks!!
    Dave

    # March 1, 2013 at 8:33 pm

    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

    # March 2, 2013 at 8:15 am

    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?

    # March 2, 2013 at 11:18 am

    >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.

    # March 2, 2013 at 12:06 pm

    I found the solution.

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

    Dave

    # March 2, 2013 at 12:06 pm

Viewing 11 posts - 1 through 11 (of 11 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".