Background image cutting off to the right for the app on facebook page

Question

I am having an issue where the background image is cutting off to the right when you scroll left to right. This is happening when the app is hosted in the iframe for our business facebook page, not when you go to apps.facebook.com. I have changed the canvas width to fluid and it is not helping.

This is an example of what I am talking about, try scrolling to the right:

https://www.facebook.com/pages/TeleManager-Technologies-Inc/134181063301299?sk=app_241678922556190

This is the link for an actual app:

http://apps.facebook.com/irefill

As you can see in the second link, nothing is being cut off to the side. I tried playing with some css properties such as "overflow" and it still didn't help.

Thank you for your help.

Answer 1

I added a width to your body tag within side of the iframe body - {width:1000px;}

Because you hadn't declared a width on the , it was inheriting the width from the iframe it is nested in, which is 520px, the max-width for facebook page tabs.

Add on a width to your that is larger than the width of the image that is being cut off and you should be good to go.

Answer 2

You only have 520 pixel width to stay inside of on Facebook.

try limiting the

body{width:520px;}