今回は透明度を指定するためのプロパティ「opacity」で発生したバグの解決法を書いていきます。まずは「.opacity」というクラスに、opacityの指定を行ないます。 .opacity:hover{ filter:alpha(opacity=80); /*IE*/ -moz-opacity:0.8; /*Firefox*/ opacity:0.8; /*Opera・Safari*/ } そしてこの「.opacity」を画像に適用します。 <img src="画像パス" class="opacity"> これでオンマウスすると画像が透明になるのですが、Firefoxのみ、オンマウス時に画像が1px動いたり、ひどい時は画像が無くなるような時も。これは背景指定が原因のようで、backgroundの指定を追記する事で解決できます。 background: #fff; これでFirefoxの問
![opacityを適用した時にオンマウスで画像が1px動いてしまったりするバグの解決法 | 素材の壺](https://cdn-ak-scissors.b.st-hatena.com/image/square/8765c45d5c13bbdeddc8e6d17b232914e7e108b1/height=288;version=1;width=512/https%3A%2F%2Fwww.materialpot.com%2Fwp%2Fwp-content%2Fuploads%2F2013%2F08%2Fpic_opacity.png)