外部リンクへのテキストの前とか後ろに、ちっちゃなアイコンがついているアレ. やりたかったんです.
何のことか分からない方. えーと、こんなやつです.
これまで、「→□」みたいなテキストを <a> タグでくくって、それっぽくしてたんですが、ちゃんとやろうということで作業してみました.
CSS で書けるのは知っていたんですが、どうやるのかが自分ではまったく思いつきません.
「リンク アイコン CSS」でググって、トップのページを見ると、いきなり分かりやすい解説が. 実質、ここだけで済んじゃいました.
CSS、やっぱり奥が深いですなぁ.
vertical-align: middle; をちゃんと指定しているのですが、Safari だとアイコンがずれて表示されます. Firefox だとちゃんと見える.
margin とかでいろいろやってみたけど、どうしても治らなかったので、アイコン画像の上下の余白を非対称にして解決しました. よく見ると、それでもずれてるんですけどね.
こういうブラウザの問題って、ほんとどうにかならんのでしょうか.
あと、密かに、ニコ動バナーを作ってたりします.
