Extra Leerzeichen nach Bild in DIV Element

Question

Ich habe ein einfaches HTML-Dokument, es enthält ein div und ein img-Element. Es gibt ein zusätzliches Leerzeichen nach dem img-Element.

Snippet ist in unten.

Ich habe es in Chrome und Firefox versucht.

Wie kann zusätzlicher Platz nach dem Bildelement entfernt werden? Ich möchte div Elementhöhe gleich mit Bild machen.

Danke.

<div style="background-color:green"> 
 
    <img src="https://cdn.cvmer.com/rapor/bg/E5402F.png" /> 
 
</div>

Answer 1

Machen Sie den img ein Blockelement.

img { 
 
    display: block; 
 
}

<div style="background-color:green"> 
 
    <img src="https://cdn.cvmer.com/rapor/bg/E5402F.png" /> 
 
</div>

Answer 2

Sie müssen nur dieses CSS

img { 
    display: block; 
} 
<div style="background-color:green"> 
    <img src="https://cdn.cvmer.com/rapor/bg/E5402F.png" /> 
</div>