Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • November 19, 2018 at 4:34 pm #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

    November 20, 2018 at 4:27 am #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

    November 26, 2018 at 2:41 am #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

    November 27, 2018 at 4:19 pm #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.

    November 28, 2018 at 1:46 am #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

    November 28, 2018 at 8:20 pm #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.

    December 2, 2018 at 11:21 pm #160589
    Skandha
    Participant

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

    Kind Regards,
    Skandha

    December 3, 2018 at 5:49 am #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

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • The topic ‘Catch Full Screen Pro: the header is not responsive’ is closed to new replies.