タイトルのカテゴリをアイコン化

hoge { font-size: 0; }

とするとFirefoxではテキストが消える事を発見。IE6では豆粒のような文字になるが...*1。面白いのでセクションのカテゴリをアイコン化してみた。

a.sectioncategory[href$="hoge%5d"] { font-size:0; }
a.sectioncategory[href$="hoge%5d"]:before { content: url( アイコン画像のURL ); }

ってな感じ。IE6は属性セレクタに対応してないので無視して普通にテキストが表示される。
どうせ皆このサイトはフィードで見ているだろうし、ページの大きな崩れも無いだろうという事で遊びでやってみている。

が、途中でアイコン作りに疲れてしまった。カテゴリが増える度にアイコン作らなきゃならないなんて...。いろんなサイトでアイコン作って表示しているけど作っている人、本当に尊敬するよ。

*1:Operaは知らない。IE7も知らない。