2014 03 19

firefoxでopacity指定した要素がhoverで1px動く

DIVをaタグでくるんだ時のhoverのopacity不具合
こちらの最後にあるように、hoverしたときに画像が1px動いてしまうケースがあった。
確かに、背景色を指定すると直るんだけど、背景が画像や単色ではないパターンなどで、透過pngのボタンなどの場合は背景色の指定ができないケースもあって、困る。

rgbaでもイケる!

どうやらrgbaでもOKなようなので、以下のように不透明度をかなーり低めにするとあまり目立たないかも。
ですが、背景色を指定していることには変わりないので、いわずもがなこれが良い方法かと言われるとそうでもない。
他にどうしても方法がない場合にやむなく使う感じかな…

background: rgba(255,255,255,.05);