Forums

  • # August 27, 2012 at 6:31 pm

    http://goo.gl/qaPKx

    If you shrink the browser to 480px or less, you will see the mobile design displays fine. However, on an actual iPhone (in portrait), it displays with the content area being much too wide.

    Here’s a picture of it on an iPhone:
    http://img703.imageshack.us/img703/1944/photoik.png

    # August 27, 2012 at 7:29 pm

    The site’s only responsive part is its changing for the iPhone size.
    It would be much easier and better to just have a separate site just for iPhone: basically, if the screen is a certain size or smaller, let a box be shown that lets people go to that site, something like this:




    ...

    With the CSS just like this:

    #send-to-mobile {
    background: white;
    box-shadow: 0 0 20px black;
    display: none;
    padding: 50px;
    }

    @media screen and (max-width: 480px) {
    #send-to-mobile {
    display: block;
    }
    }

    Then by creating the mobile site separately, you’re using a smaller stylesheet, and you’re making a much more optimised version for the iPhone, as well as being free for designing the main site specifically for desktop.

    # August 28, 2012 at 3:05 am

    Might have something to do with retina?

    # August 28, 2012 at 12:46 pm

    Do you have this meta tag in the head of your page?
    If it isn’t there, it will cause problems like you are having.



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

You must be logged in to reply to this topic.

icon-anchoricon-closeicon-emailicon-linkicon-logo-staricon-menuicon-nav-guideicon-searchicon-staricon-tag