Firefoxでリンクをクリックしたときに横に出てくる点線の消し方

• 公開日 : 2011年11月16日
• カテゴリ : Web制作

リンクの文字をtext-indentで画面外に吹き飛ばして、代替画像を表示させるテクニックは多くのサイトで使われていると思います。
しかしその際、Firefoxではクリックすると画面外に向かって点線が表示されてしまいます(画像参照)。

この無駄な点線を消すには、text-indentを使用したセレクタに対してoverflow:hidden;を足すと消えます。

Firefox以外ではこの点線は現れないようですが、Firefoxのシェアは大きいですし、こういう細かな気遣いが制作の際には大切ですよね。