How do you get the height of the subsidiary?

[Demir]

I'd like to make an opening for the picture. I've made up such a verb:

<div id="parent">
  <img/>
  <div id="children"></div>
</div>

css:

img {width: 100%;}

Can you tell me how to put a div#children high so that it's equal to height?

[Analeea]

img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.parent {

max-width: 400px;

margin: 15px auto;

position: relative;

line-height: 0;

}

.children {

position: absolute;

top: 0;

left: 0;

width: 100%;

height: 100%;

background: rgba(0, 0, 0, 0.5);

line-height: 1;

opacity: 0;

transition: 0.3s;

}

.parent:hover .children{

opacity: 1;

}

<div class="parent">

<img src="http://placehold.it/250x150" alt="">

<div class="children"></div>

</div>