Facebook Embedded Posts issue on iPad Safari and Chrome

StackOverflow https://stackoverflow.com/questions/21788534

题

Facebook Embedded Posts seems to have an issue on iPads using Safari or Chrome. If there is only one picture or video in the Facebook post, the picture slowly grows up to a certain width and destroys the complete layout.

The code example to reproduce this behaviour is pretty simple and also based on the latest Facebook documentation:

<!DOCTYPE html>
<html>

<head>
</head>

<body>

    <div id="fb-root"></div>
    <script>(function(d, s, id) {
        var js, fjs = d.getElementsByTagName(s)[0];
        if (d.getElementById(id)) return;
        js = d.createElement(s); js.id = id;
        js.src = "//connect.facebook.net/de_DE/all.js#xfbml=1";
        fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>

    <div class="fb-post" data-href="https://www.facebook.com/Boulderplanet/photos/a.618483228200641.1073741838.148729438509358/620103224705308/?type=1" data-width="666"></div>

</body>

</html>

You can also find an example here: http://beta.climbster.net/fb_feed

Can please somebody help us to clarify this issue? As Chrome on Android tablets as well as Chrome and Safari on iPhones do not have this issue, I am currently guessing it is a Facebook defect with the iFrame.

There is also no difference if the data-width parameter is set or not, neither wrapping the Facebook div in an own div with a fixed width is stopping the picture from continuously growing.

Thank you!

有帮助吗？

解决方案

I have filed this bug at Facebook and after check from their side it was accepted as valid bug.

see link

许可以下： CC-BY-SA 和 归因
不隶属于 StackOverflow
scroll top