Overriding Facebook FBML Styling on a Canvas Page

example-fbml-style.html

<link rel="stylesheet" type="text/css" media="screen" href="http://www.yoursite.com/css/canvas.css?v=1.2" />
<div id="container">
	<!-- AS AN EXAMPLE, WE'LL STYLE THE FB SHARE BUTTON -->
	<fb:share-button class="url" href="http://www.your-site-url.com" />
</div>

facebook-fbml-button.html

<fb:share-button class="url" href="http://www.my-url-to-share.com" />

facebook-fbml-css-override.css

#container .share_and_hide { font-size: 20px; }
#container .share_and_hide a.share { background-color: #fff; color: #000; }
#container .share_and_hide a.share:hover { background-color: #f0f0f0; }

facebook-fbml-sample-html.html

<div class="share_and_hide clearfix">
	<a href="/ajax/share_dialog.php?u=http://www.my-url-to-share.com&src=fbml&appid=2353941073"
	   rel="dialog"
	   title="Send this to friends or post it on your profile."
	   class="share share_a">Share</a>
</div>