Wie man ein Bild auf die volle Breite des Elternblocks macht?

Question

Ich habe div Block mit img innen. Ich habe versucht img über die volle Breite des Eltern zu machen:

<div><img></div> 

CSS

img { 
    display: block; 
    margin:0px 
    position: relative 
} 

div { 
    overflow: hidden 
} 

Answer 1

Block-Element übernimmt die volle Breite des übergeordneten Container einfach Ihre Container nicht über Breite .. und Sie angeben max-width des Bildes muss, weil es Behälter überläuft, wenn es größer ist

So:

div{ 
 
    width:200px; 
 
} 
 
img{ 
 
    max-width:100%; 
 
    
 
}

<div> 
 
    <img src="https://upload.wikimedia.org/wikipedia/commons/2/24/Male_mallard_duck_2.jpg"/> 
 
</div>

Answer 2

img { 
    max-width: 100%; 
    position: relative; // fix for old IE browsers and some blackberry browsers like UC Browser. 
    box-sizing: border-box; // fix for old operamini browsers and Get as Google preview 
}