7 replies

need help with height units in css

<div> 
<img src='img.file' alt='img' />
</div>

<div> 
<img src='img.file' alt='img' />
</div>

<div> 
<img src='img.file' alt='img' />
</div>

<div> 
<img src='img.file' alt='img' />
</div>

div{ 
height:50vh;
width:100%;
background-color:red;
}
div img { 
height:100%; 
}

div{ 
height:50vh;
width:100%;
background-color:red;
}
div img { 
height:100%; 
}

div{ 
height:50vh;
width:100%;
background-color:red;
}
div img { 
height:100%; 
}

div{ 
height:50vh;
width:100%;
background-color:red;
}
div img { 
height:100%; 
}

So if I set height:100% in img it fits in that div height but if I set vh it doesn't work , can sum1 explain why ?