サイト用の単純な不透明度スライダーを開発していますが、Firefox でのみ発生する奇妙なレンダリング バグ (?) に遭遇しました (Chrome と Opera は完全に処理します)。
問題は、スライドが互いに変化している間、それらの上に横線が表示されることです:
明らかに、画像を切り替える矢印と関係があります。それらに設定display: noneすると、線は表示されません。
矢印は> <スパンがシンプルで、テキスト シャドウがあります。それらから text-shadow を削除すると、線が細くなります。
矢印付きのスパンは、それぞれスライド コンテナーの半分を占める div 内に絶対に配置されます。これらの div は、スライドの兄弟であり、それらの上にある必要がある他の div 内にありz-index:1ます。スパンの右/左位置を設定してイメージを少しだけ重ね合わせるか、同じ目的で div を細くすると (たとえば、50% ではなく 40%)、線が消えます。
スパンの幅に関連しているように見えるかもしれませんが、max-width と display: ブロックを設定しても役に立ちません。
どうすればこの奇妙な行を取り除くことができますか? 多分それのためのCSSハックがありますか？ここでスライダーを自分で確認できます。ありがとう！