3

I have included the Facebook like box code on my website. However for some reason when viewed on an iPad the embedded Youtube links show outside the iframe (the other content does not). I have tried wrapping this with a div and applying overflow: hidden but still no joy.

It works fine on all browsers on the PC (including Safari) and as such I cannot figure out where to go with this one.

Usually with embedded videos I include wmode="transparent" in the embed code which usually sorts it. However because Facebook generates the code so I cannot access the content generated in the widget.

Any help would be much appreciated, as I have been banging my head against the wall about this for days.

Cheers

HTML

<div id="fb-root">
    <iframe id="facebookscroller" 
            src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FMorgan-Motor-Company%2F209507192406727&amp;width=450&amp;colorscheme=dark&amp;show_faces=false&amp;border_color&amp;stream=true&amp;header=false&amp;height=395"
            scrolling="no"
            frameborder="0"
            style="border:none; overflow:hidden; width:450px; height:395px;"  
            allowTransparency="false"
            wmode="transparent">
    </iframe>
</div>

CSS:

#fb-root {
    position: absolute; 
    top: 50px; 
    right: 10px; 
    z-index: 4;
    height: 395px;
    overflow: hidden;
    display: block;
}
Igor Zinov'yev
  • 3,676
  • 1
  • 33
  • 49
  • Pretty old question, but I have a similar one with Pinterest. Here the link, in case solution is found: https://stackoverflow.com/questions/44630077/ – J0ANMM Jun 20 '17 at 12:31

0 Answers0