This topic contains 7 replies, has 2 voices, and was last updated by  Skandha 1 week, 4 days ago.

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #159631

    unseenmars
    Participant

    Hi,

    I just found out the header of my site in mobile device is not responsive (it only show the “zoom-in” of the top-left of the image). However, when I tried to scale the browser into mobile size on a computer, it worked just fine.

    The link of the site: http://www.butihaveseentheearth.com/farmdesign/ (Hope you can check that)

    Thank you very much and I am looking forward to your reply.

    Best,
    Kai

    #159658

    Skandha
    Participant

    @unseenmars: The image seems to be showing up fine on android phone and the issue seems to be only on iPhones. I will look into the issue and get back to you soon.

    Kind Regards,
    Skandha

    #160103

    Skandha
    Participant

    @unseenmars: Go to => Appearance => Customize => Additional CSS and add the following CSS Code.

    @media handheld, only screen and (max-width: 668px) {
        #fullpage .section.custom-header { 
         	background-attachment: scroll;
        }
    }

    Let me know if this solves the issue on mobile phones.
    Kind Regards,
    Skandha

    #160262

    unseenmars
    Participant

    @skandha:

    Thank you for your reply. That worked only on the header; however, in the section underneath, they remained the same issue.

    #160295

    Skandha
    Participant

    @unseenmars: Can you let me know on which section the issue is persisting?

    Also I put the same header image from your site on my local environment and the image seems to be showing up fine on mobile(iPhone5) without having to add the above CSS Code. Here you can check out the screenshot:
    https://www.dropbox.com/s/l6ncnvfujdv7z8f/46837102_533403827132200_8928832400989880320_n.jpg?dl=0

    Kind Regards,
    Skandha

    #160359

    unseenmars
    Participant

    @skandha:
    Header works fine. “Promotion headline”(the second section with a short description and background with three people) and two “Recent Posts” (two sections with titles “Gallery” and “Contact”) still have problem.

    Thank you very much for the reply.

    #160589

    Skandha
    Participant

    @unseenmars: You seem to have created a different site for mobile phones. Is your issue resolved?

    Kind Regards,
    Skandha

    #160619

    Skandha
    Participant

    @unseenmars: Replace the above CSS Code by the following.

    @media handheld, only screen and (max-width: 668px) {
        #fullpage .section{ 
         	background-attachment: scroll;
        }
    }

    This should solve the issues on mobile phones.
    Let me know if this works out!
    Kind Regards,
    Skandha

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

You must be logged in to reply to this topic.