tumblrのシェアボタンって、IE7でみると javascript版はテキスト…

ベストアンサー

rouge_20082013/03/02 23:09:30

IE9の開発者ツールで確認しましたが、Javascript、PHPともに同じ動作でした。
「display」プロパティに「inline-block」が指定されている状態で、「text-indent」を指定した場合の挙動の違いが原因のようです。(※IE8以降はテキストのみ移動しますが、IE7では背景画像も移動してしまいます。)
最も簡単な方法としては、Tumblrのシェアボタンの前(※同じ行)にテキストや画像など何か出力するだけで大丈夫です。(※Tumblrのボタンは一番左に表示せず、FacebookやTwitterなどのボタンの右側に表示してみてはいかがでしょう？)

その他の方法としては、「inline-block」ではなく「block」を指定して、各種ボタンを並べて表示する場合は、「float」を指定してもいいと思います。

その他には、次のように背景画像ではなく、画像として表示してもいいと思います。

		<a href="http://www.tumblr.com/share/link?url=<?php echo urlencode(INSERT_URL_HERE) ?>&name=<?php echo urlencode(INSERT_NAME_HERE) ?>&description=<?php echo urlencode(INSERT_DESCRIPTION_HERE) ?>" title="Share on Tumblr"><img src="http://platform.tumblr.com/v1/share_1T.png" alt="Share on Tumblr" width="81" height="20"></a>

※画像URLと幅、高さは、使用するボタン画像に合わせて変更してください。

※Javascriptの場合も原因は同じですので、同様の方法で対処可能です。
※出力されるコードが同じですので、おそらくRuby on Railsでも同様の現象が発生すると思いますが、同じ方法で対処可能だと思います。

スター

この質問へのコメント

コメントはありません

tumblrのシェアボタンって、IE7でみると

ベストアンサー

rouge_20082013/03/02 23:09:30

その他の回答

この質問へのコメント

この質問への反応（ブックマークコメント）

質問の情報

この質問のカテゴリ

この質問に含まれるキーワード

人気の質問

メニュー

PC版