はてぶとfacebookとGoogle+1のソーシャルボタンを綺麗に揃える

はてぶ、facebookいいね、Google+1など、さまざまなソーシャルボタンがあります。
いまやこれなしではWebコミュニティは成り立たないでしょう。

しかしこのソーシャルボタン、各自が適当なフォーマットで作成しているため、並べると高さやら位置やらなにからなにまでばらばらです。
せめて上辺くらい揃えたいと思ったので、こんなスタイルシートを書いてみました。

iframe.hatena-bookmark-button-frame, div#___plusone_0 iframe{
	vertical-align: text-bottom;
}

これを適当に貼り付けると、あら不思議、綺麗になりました。
元ネタはこちらです。
ソーシャルボタンをキレイに並べる | ntks

実際にHTMLに埋め込むときは、headかbodyの中にこれを追加しましょう。

<style>
iframe.hatena-bookmark-button-frame, div#___plusone_0 iframe{
	vertical-align: text-bottom;
}
</style>