リンクボタンのonMouseOverをCSSに任せるべく作業中。
aをブロックレベルとしwidthとheihtを指定(aの実体部分は幅・高さ指定した透過GIFなのだが、何故か表示上の高さがそれに一致しなかったので)し、a:linkとa:hoverで背景切り替えを指定している。
SafariとOperaではきちんと背景画像が表示されロールオーヴァも効くのにFirefoxだと何故か背景画像がまったく表示されない。
ソースは以下の通り。
**HTML部 <td id="foo"><a href="baa"><img src="off/spacer.gif" width="32" height="32" border="0" alt="foo"></a></td> **CSS部 #foo a:link { background: url(off/baa.gif) no-repeat top left; } #foo a:hover { background-image: url(on/baa.gif); } a { display: block; height: 32px; width: 32px; }
困った。
対象の要素を1つだけに減らしたテスト版でも表示されないので色々調査したところ、どうもid名が数字から始まっていたのが原因だったようだ。そう言えば英字から始めないと駄目なんだっけ……忘れてた。