3

が、私はこのdiv要素を持ってproprelyレンダリングされません。本部は、IE /エッジに

#trees { 
    width: 100%; 
    position: absolute; 
    top: 37%; 
    height: 40%; 
    background: url("/img/Tree.png") repeat-x; 
    background-size: auto 100%; 
} 

それはで、私がテストしたすべてのブラウザで正常に動作します:このCSSでフォーマットされた

<div id="trees"></div> 

この結果:それはリクに見えるIE /エッジ、除き

Normal trees

Eこの:カラーグリッチと

木:

奇妙な部分は、この問題は私が検索してい...列車のトラックや山のような同様に構成された背景画像と、他のdiv要素に影響を与えないことですこれについては多くの人が答えを見つけることができませんでした。私はまたpngからgifへ画像を変換しようとしましたが、私は同じ結果を得ました。 IE/Edgeとの互換性をどのように修正すればよいでしょうか? IrfanViewはを剥離している場合...私はよく分からない(、透明性と非圧縮を保存しない)ここ

+0

問題を示す[mcve]を提供できますか? –

+0

私はcodepenの例を追加しました! –

+0

私は、Adobe画像編集製品を使用して画像からAdobe XMPメタデータを削除する必要があると思います。ファイルの名前を変更することはできません。そのイメージを作成しましたか(https://image.ibb.co/k388T5/Tree.png)?またはサードパーティソースからのものでしたか? –

答えて

0

私はあなたと同じ問題を抱えていましたが、これで問題の原因が解決されませんでした。イメージのエッジに透明なパディングを追加し、バックグラウンドサイズを大きくすると、多くの場合。

https://codepen.io/anon/pen/BRwxbR 次の縮尺のマ​​イバックグラウンドを追加するため、適切なレベルに設定してください。

background-size: auto 250%; 
background-position: center center; 

色の変化を無視してください - 特定の色は、あなたの最初の問題に基づいて、それをトリガーした場合、私も思っていたが、それはしませんでした。

ここで私の回避策が実際に私の問題を解決するわけではないので、私はさらにこれを見るかもしれません。 :)

+0

すごくうれしくありがとう! –

0

https://codepen.io/darthmooguy/pen/gmNWwgツリー画像(PNG)ですIrfanViewはから保存:ここ

は、エッジでの問題を再現codepenですAdobeのメタデータ。

enter image description here

あなたが見ることができるように...色や透明度の色は、Adobe執筆ソースとは全く異なるものです。