2017-10-05 8 views
0

高さ100%、幅自動の画像があります。それは常に正方形であり、歪んではいけません。ウェブサイトの背高を低くするためにブラウザのサイズを変更すると、画像が歪んでしまいます。歪んだ状態でインスペクタを開き、高さ100%のチェックを外してから再度チェックすると、画像が正方形に戻ってきます。Chromeの画像スキューバグ

<html> 
    <body> 
     <div id=outer style='height:100vh'> 
      <div style='height:50%'> 
       <img style='height:100%;' src='https://i.pinimg.com/236x/0f/9a/36/0f9a36457c046fe12c2c69ad60a3e737--creative-thinking-texture.jpg' /> 
      </div> 
     </div> 
    </body> 
</html> 

https://jsfiddle.net/auey41fd/

これは本当にクロムのユーザーのために、私のサイトをめちゃくちゃにされています。誰もが良い仕事を知っていますか?ユーザーがブラウザのサイズを変更したときだけではありません。外側の容器の背の高さが低くなるたびに、内部の画像が歪んでしまいます。これはvhユニットの使用に特有のものではありません。 FirefoxとIEではすべてうまく動作します。

答えて

0

heightからmin-heightに変更してください。それはあなたの問題を解決するはずです。

+0

画像に?いいえ、助けにはならなかった。 – Curtis

関連する問題