私のグリッド画像ギャラリーには、各行に4つの画像があります。CSSのwidth：25％は幅をレスポンシブにしますが、高さもレスポンシブにする必要があります。現時点では、高さは180pxです。幅のように反応するようにパーセンテージで設定できますか？試しましたが、パーセンテージで設定すると機能しません。height：x％をline1 img / line2 imgに移動した場合にのみ機能しますが、画像が押しつぶされます。
<div class="line1">
<img src="image1.jpg" alt="image1.jpg" />
<img src="image2.jpg" alt="image2.jpg" />
<img src="image3.jpg" alt="image3.jpg" />
<img src="image4.jpg" alt="image4.jpg" /></div>
<div class="line2">
<img src="image5.jpg" alt="image5.jpg" />
<img src="image6.jpg" alt="image6.jpg" />
<img src="image7.jpg" alt="image7.jpg" />
<img src="image8.jpg" alt="image8.jpg" /></div>
.line1{
overflow:hidden;
height:180px;
}
.line1 img{
width:25%;
}
.line2{
overflow:hidden;
height:180px;
}
.line2 img{
width:25%;
}