Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #194139

    Hi,

    I have previously gotten good help here in making some changes to my webpage–e.g. removing sidebars on the blog page. I just realized, however, that my page does not now automatically fit to mobile screens. Any ideas? My site is http://www.lifebydesignpc.com.

    Thank you!

    Mike

    #194209

    Hi Tewilliger!

    Please add this at the very bottom of the custom.css or Quick CSS field:

    @media only screen and (max-width: 767px) and (min-width: 480px) {
    .container .one.unit, .container .two.units, .container .three.units, .container .four.units, .container .five.units, .container .six.units, .container .seven.units, .container .eight.units, .container .nine.units, .container .ten.units, .container .eleven.units, .container .twelve.units, #top .one_fifth, #top .one_fourth, #top .one_third, #top .two_fifth, #top .one_half, #top .three_fifth, #top .two_third, #top .three_fourth, #top .four_fifth {
    width: 420px !important;
    margin-left: 0;
    margin-bottom: 10px;
    }
    }

    Regards,
    Ismael

    #196340

    Hey Ismael,

    Unfortunately, the page is still not displaying correctly on my IPhone. Here is what I have in my “Quick CSS”

    Thanks!

    .template-blog .sidebar.units.sidebar_right.three{
    display: none;
    }
    .template-blog .content {
    width: 100% !important;
    }
    .template-blog .six.units{

    width: 690px !important;
    }

    .blog-meta { display: none; }
    @media only screen and (max-width: 767px) and (min-width: 480px) {
    .container .one.unit, .container .two.units, .container .three.units, .container .four.units, .container .five.units, .container .six.units, .container .seven.units, .container .eight.units, .container .nine.units, .container .ten.units, .container .eleven.units, .container .twelve.units, #top .one_fifth, #top .one_fourth, #top .one_third, #top .two_fifth, #top .one_half, #top .three_fifth, #top .two_third, #top .three_fourth, #top .four_fifth {
    width: 420px !important;
    margin-left: 0;
    margin-bottom: 10px;
    }
    }

    #196757

    Hey!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 480px) { .template-blog .six.units {
    width: 310px !important;
    }}

    Regards,
    Yigit

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

You must be logged in to reply to this topic.