Question

I have made an app which will be a FB page tab. Now I am trying to get rid of the scrollbars that come when the content exceeds 800px height. I used the following code to do this:

<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
    FB.init({
        appId : '<?php echo $app_id; ?>',
        status : true, // check login status
        cookie : true, // enable cookies to allow the server to access the session
        xfbml : true // parse XFBML
    });
</script>
<script type="text/javascript">
    window.fbAsyncInit = function() {
        FB.Canvas.setAutoGrow();
    }
    // Do things that will sometimes call sizeChangeCallback()
    function sizeChangeCallback() {
        FB.Canvas.setSize(); 
    }
</script>

Now this works fine for Google Chrome but shows scrollbars for firefox. In fact, initially there was no horizontal scrollbar which has now appeared. At some blog it was written that to get rid of this error we should set overflow to hidden. I tried doing that too but that cuts of the content. What is the solution to this? This is my CSS for html and body:

html {
    border: 1px solid #cccccc;
    min-height: 798px;
    font-size: 12px;
    overflow: hidden;
}
body {
    width: 495px;
    overflow: hidden;
font-size: 12px;
background-color: #f7f7f7;
color: #444444;
font-family: lucida grande, tahoma, verdana, arial, sans-serif;
}

Answer 1

I have been having the same issue with firefox adding scrollbars to my facebook page/tab.
The fix in the end was…

1. In the app setting make sure you have ‘page tab’ and ‘app on facebook’ set up with the page tab/canvas url and the secure version.

2. The code:

<div id="fb-root"></div>
<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : 'FB_APP_ID', // App ID
      channelUrl : 'FB_CHANNEL_URL', // Channel File
      status     : true, // check login status
      cookie     : true, // enable cookies to allow the server to access the session
      xfbml      : true  // parse XFBML
    });

    // Additional initialization code here
    FB.Canvas.setAutoGrow();
  };

  // Load the SDK Asynchronously
  (function(d){
     var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
     js = d.createElement('script'); js.id = id; js.async = true;
     js.src = "//connect.facebook.net/en_US/all.js";
     d.getElementsByTagName('head')[0].appendChild(js);
   }(document));
</script>

Good luck!