css height auto vs 100 code example

Example 1: height auto width 100% will ignore width and height

<style>
  img {
    width: 100%;
    height: auto;
    aspect-ratio: attr(width) / attr(height);
  } 
</style>
<img src="hero_image.jpg" alt="" width="500" height="500">

Example 2: css height auto vs 100

<div style="height:50px">
    <div id="innerDiv" style="height:auto">
          <div id="evenInner" style="height:10px">
          </div>
    </div>
</div>

Example 3: css height auto vs 100

<div style="height:50px">
    <div id="innerDiv" style="height:100%">
    </div>
</div>