Archived topic

Facebook Browser Issues

7 replies · Started by Neil on September 11, 2017

Viewing posts 1–8 of 8

September 11, 2017 at 8:50 am #383268

Hi Guys,

I wasn't aware that Facebook even rendered web pages internally until someone pointed this out to me.

When viewing our site form within Facebook, the page header images don't seem to scale well at all. All other images seem to be fine but the page headers seem to be super zoomed in.

If you go to our Facebook page, https://www.facebook.com/fickaskap/ - feel free to follow us too ;) and then click on the "learn More" button it'll load up our page.

Any ideas for this one?

Thanks,

Neil.

September 11, 2017 at 1:48 pm #383452

Hi there,

Looks good to me on desktop and mobile.

Can you show me a screenshot of what you're seeing?

September 11, 2017 at 11:53 pm #383654

Hi Tom,

It does it on my wife's iphone, screenshot here.

Thanks,

Neil.

September 12, 2017 at 8:56 pm #384338

Do you have this custom CSS added?:

.generate-content-header {
    background-attachment: fixed;
}

If so, can you try adding this?:

@media only screen and (max-device-width: 1024px) and (-webkit-min-device-pixel-ratio: 1) {
    .generate-content-header {
        background-attachment: scroll !important;
    }
}

iOS doesn't like fixed attachment for some reason.

September 13, 2017 at 12:38 am #384425

Hi Tom,

Having tried the website on my wife's iphone in safari, it's not just the facebook browser that's affected. I'll make the changes you have suggested and retest again later.

It just proves the need for having multi-device testing!

Thanks for your help as always.

Neil.

September 13, 2017 at 9:27 am #384725

Sounds good :)

September 13, 2017 at 10:53 am #384801

Just tried it again on an iphone and it's fixed now that I have done your changes.

Thanks as always for your help :)

September 13, 2017 at 8:39 pm #385010

You're welcome! :)

This archived topic is closed to new replies.

Start building better websites today.