I recently ran into issues with Safari randomly clipping my DOM elements. See the image below to see what I mean:

This isn’t a matter of simple overflow: hidden – this rendering error will occur randomly and will correct itself if other elements on the page move or you highlight some of the affected DOM elements.Or sometimes it won’t. It’s random, after all.

I found a way of preventing this from happening by making sure the DOM elements’ container has a set width and height. In my case, the width and height meant nothing in terms of how the elements were rendered (they are all absolutely positioned), but for some reason Safari took this into consideration. I tried random dimensions and it seems to make a small difference with clipping edge elements for only a fraction of a second, but in the end always renders completely. As a rule, you will probably want to make your bounding box larger than the elements within it to get the smoothest result.

Let me know if you’ve run into this and if this helps!

If you followed this (https://developers.facebook.com/docs/reference/dialogs/feed/) to the T and are getting an error, try this simple fix:

var obj = {
 method: 'feed',
 redirect_uri: 'YOUR URL HERE',
 link: 'https://developers.facebook.com/docs/reference/dialogs/',
 picture: 'http://fbrell.com/f8.jpg',
 name: 'Facebook Dialogs',
 caption: 'Reference Documentation',
 description: 'Using Dialogs to interact with users.'
};

FB.ui(obj, callback);

The redirect_uri  parameter is not meant for FB.ui() calls, and will break them. Remove redirect_uri from your obj and you should be good to go.