オーバーフローイメージから余分な空白を削除するCSS

Question

イメージのオーバーフローを特定の画面サイズで非表示にするようにしようとしていますが、この余分なスペースが表示される理由の解決策が見つかりません。ここに私がこれまでに持っていたCSSがあります。私はイメージが小さすぎるように見えるので、これをやろうとしています。

ブートストラップソリューションも歓迎します。

.aboutsplash img{ 
 
\t width: 100%; 
 
\t height: auto; 
 
\t margin: 0; 
 
} 
 
@media (max-width: 769px){ 
 
\t .aboutsplash img{ 
 
\t overflow: hidden; 
 
\t width: auto; 
 
\t max-height: 150px; 
 
\t } 
 
} 
 
@media (max-width: 500px){ 
 
\t .aboutsplash img{ 
 
\t position: left; 
 
\t margin: 0 0 0 -25%; 
 
\t } 
 
}

<div class="aboutsplash"> 
 
    <img src="images\sunsetcrop2.jpg" alt="lbl sunset"> 
 
</div>

Answer 1

@media (max-width: 769px){ 
    .aboutsplash { 
     overflow: hidden; 
    } 
    } 

これを試してみてください。