How to make image size relative to parent using CSS?

To resize small images, putting them in small container and pushing that small container with another element is a clean solution. In my opinion tables are great for that.

Here is the code;

<div class="col col-span-1" style="position : relative">
    <img style="max-width:800px; max-height:800px;width:100%; height:100%;" src="">
  <table style="position: absolute;top: 75%;width: 85%;">
        <td style=" width: 60%;"></td>
        <td style=" max-width: 90px; width: 39%;">
          <div style="">
            <img src="" style="width:100%; height: 100%;">