Facebook 'Send' window goes off-screen on mobile phones. (3 posts)

  1. Brodersen
    Posted 2 years ago #

    Hi Support.

    I'm trying to use this official Facebook plugin.

    This is the site I'm working on:


    The issue is the popup box under facebook 'Send' button goes off-screen to the left:

    This problem only occurs when viewed on a mobile (tried both iPhone 4S and on a Windows phone).
    It's very important that the site works on mobile.
    It looks fine in a web browser, and stays in its position even when the browser windown is narrowed.
    However, even in the browser the facebook pop-up input box becomes too large for the width on a mobile.
    I tried a lot of things in WordPress's custom css, but nothing seemed to work or it just made the Send button disappear.

    Any help would be very much appreciated!

    (FYI: I'm trying to ask this same question on the support forum, for the WordPress theme I'm using: http://www.kriesi.at/support/topic/facebook-send-window-goes-off-screen-on-mobile-phones?replies=1#post-87850)

  2. tomontoast
    Posted 2 years ago #

  3. Brodersen
    Posted 2 years ago #

    The best solution I've tried so far is this:

    .fb_edge_widget_with_comment span.fb_edge_comment_widget {<br />
        left: -45px !important;<br />

    This temporary solution moves the pop-up box to a somewhat centered position under the Send button, which makes it accessible on the mobile.

    This is how it looks like on an iPhone (notice it's still too a bit too wide for mobile):

    Horizontal view on iPhone:

    Same page viewed in a PC browser:

    The small arrow on top of the popup is now no longer aligned with the Send button (due to my css). Notice how it switches position to be on the left or right side of the popup, depending on where it's viewed (mobile or PC browser).

    (I tried it on a Lumina 920 as well, but gave the same issue as iPhone)

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic