jQuery .load（）图片未显示

Question

使用jquery .load（）方法将html文件加载到div中。该页面确实加载；但是，图像不会显示（即使它们显示在开发人员控制台的网络活动中。）如果我重新加载整个网站，则图像将显示。清除缓存；但是，导致图像在重新加载之前不再显示。我的HTML：

<div id="aboutus">
   <h2>About us</h2>
   <div class="biocard">
      <img src="/resources/person1.png" alt="Person 1 Image">
      <div class="biotext">
         <h2>Meet Persion 1</h2>
         <p>Blah Blah Blah</p>
      </div>
   </div>
   <div class="biocard">
      <img src="/resources/person2.png" alt="Person 2 Image">
      <div class="biotext">
         <h2>Meet Persion 2</h2>
         <p>Blah Blah Blah</p>
      </div>
   </div>
   <div class="biocard">
      <img src="/resources/person3.png" alt="Person 3 Image">
      <div class="biotext">
         <h2>Meet Persion 3</h2>
         <p>Blah Blah Blah</p>
      </div>
   </div>
</div>

CSS：

      .biocard{
        display: flex;
        border-top: 1px solid $base-color;
        align-items: center;
        margin-bottom: 15px;
        h2{
          color: $base-color;
        }
        img{
          border-radius: 50%;
          width: 200px;
          height: 100%;
          margin: 0px 15px 10px 0px;
        }
}

jQuery：

$("#pagecontent").load("/documents/aboutus.html");

pagecontent是我位于当前加载页面上的一个简单div。

*编辑*

似乎删除了CSS中的img{height: 100%;}可以解决此问题。想知道加载时div.biocard的高度是否未知，并且图像高度设置为0。