How to auto/snap fit to mobile?

Community Forums Forums General Discussion How to auto/snap fit to mobile?

This topic is: not resolved

This topic contains 2 replies, has 2 voices, and was last updated by  spoll 1 year ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #71877

    spoll
    Participant
    Post count: 42

    I’m trying to figure out a way to make my site auto fit my phone or tablet. It snaps to fit automatically if I double tap the screen after my site comes up. Any ideas which code needs adjusting? I’m assuming it’s in here:

    /* Responsive Design
    ———————————————————— */

    @media only screen and (max-width: 960px) {

    body,
    .news-landing #inner,
    #inner {
    width: 100%;
    margin: 0 auto;
    }

    .content-sidebar #inner,
    .sidebar-content #inner,
    .content-sidebar-sidebar #inner,
    .sidebar-sidebar-content #inner,
    .sidebar-content-sidebar #inner {
    background: #fff;
    }

    #header,
    #inner,
    #nav {
    border: none;
    }

    .archive-page,
    .content-sidebar #content,
    .content-sidebar #content-sidebar-wrap,
    .content-sidebar-sidebar #content,
    .content-sidebar-sidebar #content-sidebar-wrap,
    .footer-widgets-1,
    .footer-widgets-2,
    .footer-widgets-3,
    .full-width-content.news-landing #content,
    .full-width-content #content,
    .full-width-content #content-sidebar-wrap,
    .home-middle-left,
    .home-middle-right,
    .home.news.content-sidebar #content,
    .news-landing .wrap,
    .sidebar,
    .sidebar-content #content,
    .sidebar-content #content-sidebar-wrap,
    .sidebar-sidebar-content #content-sidebar-wrap,
    .sidebar-content-sidebar #content,
    .sidebar-sidebar-content #content,
    #content-sidebar-wrap,
    #footer,
    #header,
    #home-bottom,
    #home-middle,
    #home-top,
    #sidebar-alt {
    box-sizing: border-box;
    width: 100%;
    }

    #footer .creds,
    #footer .gototop,
    #header ul.menu,
    #header .widget-area,
    #nav,
    #subnav,
    #title-area {
    float: none;
    text-align: center;
    width: 100%;
    }

    #title-area {
    padding: 10px 0 0;
    }

    #header .widget-area {
    padding: 0px 0;
    }

    #header .searchform {
    float: none;
    padding: 0;
    text-align: center;
    }

    #header ul.menu {
    float: none;
    }

    #header li,
    #nav li,
    #subnav li {
    display: inline-block;
    float: none;
    }

    #header li li,
    #nav li li,
    #subnav li li {
    text-align: left;
    }

    #nav li.right,
    #subnav li.social-facebook,
    #subnav li.social-rss,
    #subnav li.social-twitter {
    display: none;
    }

    .home.content-sidebar #home-bottom .featuredpost .post {
    padding: 0 0 10px;
    }

    .entry-content img,
    .featuredpage img,
    .featuredpost img,
    .post-image,
    .ui-tabs img {
    border: none;
    padding: 0;
    }

    img.ad-left,
    img.ad-right {
    float: left;
    margin: 5px 10px 5px 0;
    }

    #footer {
    background: none;
    padding: 15px 0 10px;
    }

    #footer p {
    padding: 0 20px;
    }

    }

    @media only screen and (max-width: 600px) {

    #title {
    font-size: 36px;
    line-height: 1;
    }

    #nav li a,
    #subnav li a {
    font-size: 12px;
    padding: 0px;
    }

    #home-top .ui-tabs ul.ui-tabs-nav {
    display: none;
    }

    #content {
    padding: 15px 20px;
    }

    h1,
    h2,
    h2 a,
    h2 a:visited {
    font-size: 24px;
    }

    h3,
    h4 {
    font-size: 18px;
    }

    .five-sixths,
    .four-fifths,
    .four-sixths,
    .one-fifth,
    .one-fourth,
    .one-half,
    .one-sixth,
    .one-third,
    .three-fifths,
    .three-fourths,
    .three-sixths,
    .two-fifths,
    .two-fourths,
    .two-sixths,
    .two-thirds {
    padding: 0;
    width: 100%;
    }

    }

    http://spolltest.com
    #71880

    Gary Jones
    Moderator
    Post count: 693

    Main thing would be the viewport meta tag, but you have that already. Looks fine here in Chrome on Nexus 5.


    Changes in Genesis 2.1 – the ultimate guide to every single change in Genesis Framework 2.1, 2.1.1 and 2.1.2 (all 90 of them!) | @GaryJ

    #71883

    spoll
    Participant
    Post count: 42

    Thanks for checking, maybe it’s an Apple issue?

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

You must be logged in to reply to this topic.