Padding between the image and the border
I am developing a facebook fanpage. I am having problem with the space between the main image that I am using and the border of the page. I just want the image to appear and take all of the space on the fanpage.
Here is my code,
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Nikah4Life</title>
<script type="text/javascript">window.fbAsyncInit = function() {FB.Canvas.setSize();}// Do things that will sometimes call sizeChangeCallback()function sizeChangeCallback() {FB.Canvas.setSize();}</script>
</head>
<body>
<div style="text-align:center; width:532px; margin-left:auto; margin-right:auto;">
<img id="Image-Maps_8201108311953149" src="sponsors.jpg" usemap="#Image-Maps_8201108311953149" border="0" width="400" height="700" alt="" />
<map id="_Image-Maps_8201108311953149" name="Image-Maps_8201108311953149">
<area shape="rect" coords="53,6,356,33" href="http://www.nikah4life.com/" target="_blank" alt="" title="" />
<area shape="rect" coords="146,650,259,691" href="http://www.nikah4life.com/" target="_blank" alt="" title="" />
<area shape="rect" coords="59,269,123,303" href="http://twitter.com/#!/Nikah4Life" targe开发者_如何学运维t="_blank" alt="" title="" />
<area shape="rect" coords="165,269,236,303" href="http://www.youtube.com/nikah4life" target="_blank" alt="" title="" />
<area shape="rect" coords="268,269,349,303" href="http://www.nikah4life.com/contact.php" target="_blank" alt="" title="" />
<area shape="rect" coords="8,328,179,397" href="http://harunyahya.co.uk/" target="_blank" alt="" title="" />
<area shape="rect" coords="134,396,291,461" href="http://www.linksdisti.com/" target="_blank" alt="" title="" />
<area shape="rect" coords="222,324,395,399" href="http://www.zainbhikha.com/index.htm" alt="" target="_blank" title="" />
<area shape="rect" coords="245,488,387,625" href="http://www.youtube.com/nikah4life" alt="" target="_blank" title="" />
<area shape="rect" coords="361,426,395,459" href="http://www.technology-arena.com/" alt="" title="" />
<area shape="rect" coords="8,426,40,459" href="http://www.technology-arena.com/" alt="" title="" />
</map>
</div>
<div id="fb-root"></div>
<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId : 'your APP ID Goes Here',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true// parse XFBML
});
FB.Canvas.setAutoResize(7);
</script>
</body>
</html>
EDIT: Changing the alignment from middle to left made it work. Thanks for the answers.
The canvas for Pages is supposed to have a border on it. I don't think it can be removed.
use this code in your css
body { width:520px; margin:0; padding:0; border:0; overflow:hidden; }
加载中,请稍侯......
精彩评论