I have created a facebook iframe application and set the dimensions to Auto Resize in the Facebook Application settings page but still a horizontal scrollbar is shown at the bottom in IE and Google Chrome. Works fine in Firefox. Any solution ?
A simpler way is however, is to use a container div styled with overflow: hidden; to hide the scrollbar. Set the width and the height of the div, to be slightly less than that of your iframe. Hope this helps you.
To hide the horizontal scrollbar and prevent horizontal scrolling, use overflow-x: hidden: HTML. CSS.
1. Set the overflow of the parent div as hidden. 2. Set the overflow of the child div to auto and the width 200% (or anything more than 100%, or more than the width of the parent - so that the scrollbar gets hidden).
It's explained how to do this here: http://clockworkcoder.blogspot.com/2011/02/how-to-removing-facebook-application-i.html Basically you should use
window.fbAsyncInit = function() { FB.Canvas.setAutoGrow(); };
plus make sure that your html and body tags are set to overflow:hidden
so you don't get those briefly shown scroll bars that are so annoying
<html xmlns="http://www.w3.org/1999/xhtml" style="overflow: hidden"> <head> <!-- Header stuff --> </head> <body style="overflow: hidden">
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With