Firefox：「画像＋文字」をaタグで囲むと画像にも下線（text-decoration:underline）が出る
自分用覚え書き。
たとえば、
<a href="hoge.html"><img src="fuga.jpg" />ほんだららった</a>等としたとき、CSSでaタグに
a:hover{text-decoration:underline;なんてことをしておくと、hover時に textではないimg要素にも下線が表示されるようになっちゃうみたい@firefox3.0.3。
暫定的解決策： ■ http://www.webmasterworld.com/forum83/7442.htm
<a href="hoge.html"><img src="fuga.jpg" /><span>ほんだららった</span></a>上記のようにテキスト部分をspanでくくっちゃって、
a:hover span{text-decoration:underline;}としてやるとテキストだけにunderlineされるようになる。
ちなみにa要素の中身がimgだけだと下線はつきません。これバグ？仕様？なんにしてもソースがとても気持ち悪いことになっちゃうなー。
なんとなく、仕様書読んでると（怪しい英語力で）imgだけの場合、線が出ないって仕様は正しい感じがします。。仕様書どおりにブラウザ作ってるからそうなるんですかね、、？
http://www.w3.org/TR/CSS21/text.html#lining-striking-props
アヨハタ
16 10 月 08 at 3:45 PM
IEでのみ意図どおりに表示されるのでこれはIEがダメ実装なんだろうなと思ってましたが（笑）、なるほど仕様なんですねぇ。
# Each line of text is underlined.とか言ってるので、
# テキストだけが対象であるべきなのかなと勝手に解釈してました。
いかんせんソースがスパンスパンして気持ち悪いのですが、何かスマートな解決法はないものかしら。
admin
16 10 月 08 at 5:56 PM