リンク・フォーカス時の点線が画面外まで拡張される問題 - Archiva

Make a note of it: Web tech, montaineering, and so on. Note: この記事は、3年以上前に書かれています。Webの進化は速い！情報の正確性は自己責任で判断してください。 CSSでテキストを画像に置き換えた場合、フォーカス時にリンク領域を囲む点線が左側にぐぐ～っと伸びてしまう問題 ...に対処する方法。 上記の問題は、Firefoxで起きる。原因は画像置換を行う手段として、「text-indent」を使用しているから。text-indentによって表示領域外まで飛ばされたテキスト部分の分だけ、フォーカス時の点線が拡張されているのだと思われます。 この問題に対処するには、<a>に対して「overflow: hidden;」を指定してやれば良い。 おまけ なお以下のように指定すれば、フォーカス時の点線は消すこともできる。 #logo a:f

[toton]

画像 css 選択 点線 消す

[sakura3942]

画像置換のリンク