Horizontal Scroll Bar appearing on Page Tab_问答_开发者

Horizontal Scroll Bar appearing on Page Tab

开发者 https://www.devze.com 2023-04-01 03:46 出处：网络

how can I remove horizontal scroll bar appearing on page tab. I had a designer create the reveal page and am uncertain what to change to the html file to make the scroll disappear. It is the welcome page on this fanpage http://www.facebook.com/pages/MaidPro-of-Northern-Cincinnati/154767811271566?sk=app_214902645232913

This is the current code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="applicati开发者_StackOverflow社区on/xhtml+xml; charset=UTF-8" />
<meta name="generator" content="SiteGrinder 2  http://www.medialab.com/sitegrinder" />
<title>maid_pro</title>

<link rel="stylesheet" type="text/css" media="screen, print, projection"  href="maidpro.css"></link>
</head>
<body>
<div  id="maidpro">
<div id="like"></div>
<div id="layer8"></div>
<div id="layer7"></div>
<div id="watchthisvideo"></div>
<div id="id5video"></div>
<div id="videoliteral">
<iframe width="389" height="217" src="http://www.youtube.com/embed/ogSI0DscP_4" frameborder="0" allowfullscreen></iframe>
</div>
<div id="shadow"></div>
</div>
</body>
</html>

You have several things wrong by looking at the page. You should get the designer to fix it. It seems designed for a width greater than Facebook allows, which is 520px. To start, in maidpro.css, set the #maidPro width to 520 or less, and anything wider than that start shrinking. And then removing "left" values to shift the items back over.

Set the css in this way to remove the scrollbar

body {
            width:520px;
            margin:0;
            padding:0;
            border:0;
            overflow:hidden;
            }

and use FB.Canvas.setAutoResize();

The answer here: Facebook App - Javascript Set Height of Canvas? is the best solution

I had this problem too and the usual approach didn't seem to work. But after using the tricks mentioned in that post, I managed to finally get rid of the scrollbars.