image - レスポンシブコンテナ内のレスポンシブ画像？

Question

このレスポンシブ画像、または本来あるべき画像を、ネストされている親に合わせるにはどうすればよいですか？

適切なCSSを適用しましたが、HTMLで幅や高さを定義していません。これが私のCSSです。

.header {
    height: 25%;
    width: 95%;
    padding: 2.5%;
    background: #fff;
}
.header img {
    max-width: 100%;
    height: auto;
}

ここで問題を確認できます： http ：//www.client.noxinnovations.com/jensenblair/

大きな円の画像？それはレスポンシブであるはずです。

ありがとう！

Answer 1

私はここで何かが欠けているかもしれませんが、設定：

height:100%;

画像は私のために働くために...

Answer 2

次のように、max-widthをwidthに変更するだけで済みます。

.header img {
    width: 100%;
    height: auto;
}

Answer 3

これは古い質問だと思いますが、

display：flex;

すべてのブロックタイプ要素の親に対して、それらは親要素の最大幅を持ちます。