Entfernen Sie zusätzliche Leerzeichen aus dem Überlauf-Bild CSS

Question

Ich versuche, den Überlauf eines Bildes auf einer bestimmten Bildschirmgröße ausgeblendet erscheinen, aber ich kann nicht die Lösung finden, warum dieser zusätzliche Abstand angezeigt wird. Hier ist das HTML und CSS, das ich bisher habe. Ich versuche das zu tun, weil das Bild zu klein erscheint.

Bootstrap-Lösungen sind ebenfalls willkommen.

.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; 
    } 
    } 

dies versuchen.