とあるホームページの制作をしている際に、画像ファイルにfacebookサイトへのリンクを設定して、ブラウザで表示させてみると、画像が表示されないという現象に遭遇しました。
この現象をもう少し詳しく説明すると、Internet Explorer 11やEdge、Windows 10上のFirefoxでは問題なく表示されるのですが、Windows 8.1上のFirefox 59.0.2では画像が表示されるべき位置に、一瞬だけ矩形が表示され、その後その矩形が消えるというものです。
キャッシュが破損したのかなと思い、スーパーリロードをやってみましたが、改善が見られません。
headタグ内のcssやjavascriptファイルのロードをやめてみましたが、改善しません。
bodyタグ内を問題の画像リンクだけにしてみても、やはり画像が表示されません。
Firefoxのインスペクターを使って当該部分を見てみると、imgタグに設定した覚えのないstyle="display: none !important;"という属性が付加されており、このために表示できないようです。
力ずくになりますが、このimgタグに予めstyle="display: inline !important;"と設定したらうまく行くだろうと思いましたが、これも改善が見られません。
じゃあもういっそのこと画像リンクをやめて、テキストリンクにすると、これはもう当然のように問題なく表示されるわけです。
ここでようやくimgタグのsrc属性に原因があるのではないかと思い至りました。
ではということで、画像のファイル名を全く違うものにしてみると、今度は問題なく画像が表示されました。
なんとファイル名にfacebookという文字列が含まれると、現象が再現することが分かりました。
まさかそんなことがとは思いますが、これは紛れもない事実で、Firefoxのバグなのだろうと思います。