Html MS Edge图像不考虑flex基础

我有一个特殊的例子，Edge的flexbox与其他浏览器不一样。甚至IE11也在处理这一问题，几乎与Chrome和Firefox一样

以下是适用于所有浏览器的预期结果：

相反，这是在Microsoft Edge中发生的情况：

这就像图像不尊重30%弹性基础的界限一样。如果我将标记更改为a并将标记放在其中，则在某种程度上解决了问题。如果这样做的话，它会在设计中给我带来其他问题，这里没有显示，所以如果可以的话，我想避免它。它不需要有包装器div

真正奇怪的是，我找不到任何文件来记录为什么会发生此问题。我已经查看了FlexBug列表，但似乎什么都不适用

Html：

<div class="sections-container">
<section class="content-tiles-section">
    <div class="content-tiles-content">
        <div class="content-tiles">
                <div>
                    <img class="content-tile-image" src="http://via.placeholder.com/431x288">
                    <div class="content-tile-content">
                        <h4>
                            <a href="#">
                                Title Link
                            </a>
                        </h4>
                        <div class="content-tile-paragraph p-like">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lorem justo. Maecenas eget dui est. In cursus. 
                        </div>
                    </div>
                    <a class="content-tile-link" href="#">
                        Learn More
                    </a>
                </div>
                <div>
                    <img class="content-tile-image" src="http://via.placeholder.com/398x266">
                    <div class="content-tile-content">
                        <h4>
                            <a href="#">
                                Title Link
                            </a>
                        </h4>
                        <div class="content-tile-paragraph p-like">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lorem justo. Maecenas eget dui est. In cursus. 
                        </div>
                    </div>
                    <a class="content-tile-link" href="#">
                        Learn More
                    </a>
                </div>
                <div>
                    <img class="content-tile-image" src="http://via.placeholder.com/462x308">
                    <div class="content-tile-content">
                        <h4>
                            <a href="#">
                                Title Link
                            </a>
                        </h4>
                        <div class="content-tile-paragraph p-like">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lorem justo. Maecenas eget dui est. In cursus. 
                        </div>
                    </div>
                    <a class="content-tile-link" href="#">
                        Learn More
                    </a>
                </div>
                <div>
                    <img class="content-tile-image" src="http://via.placeholder.com/505x335">
                    <div class="content-tile-content">
                        <h4>
                            <a href="#">
                                Title Link
                            </a>
                        </h4>
                        <div class="content-tile-paragraph p-like">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lorem justo. Maecenas eget dui est. In cursus. 
                        </div>
                    </div>
                    <a class="content-tile-link" href="#">
                        Learn More
                    </a>
                </div>
                <div>
                    <img class="content-tile-image" src="http://via.placeholder.com/450x300">
                    <div class="content-tile-content">
                        <h4>
                            <a href="#">
                                Title Link
                            </a>
                        </h4>
                        <div class="content-tile-paragraph p-like">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lorem justo. Maecenas eget dui est. In cursus. 
                        </div>
                    </div>
                    <a class="content-tile-link" href="#">
                        Learn More
                    </a>
                </div>
                <div>
                    <img class="content-tile-image" src="http://via.placeholder.com/500x333">
                    <div class="content-tile-content">
                        <h4>
                            <a href="#">
                                Title Link
                            </a>
                        </h4>
                        <div class="content-tile-paragraph p-like">
                            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean at lorem justo. Maecenas eget dui est. In cursus. 
                        </div>
                    </div>
                    <a class="content-tile-link" href="#">
                        Learn More
                    </a>
                </div>
        </div>
    </div>
</section>
</div>

---

任何见解都将受到高度赞赏

我的edge版本已过时。我没有设置自动更新，所以它是在2015年的版本

版本：20.10240

---

EdgeHTML版本：12.10240

您的代码笔正在我的microsoft edge 15上工作。edge和Chrome在这里呈现相同的效果。@Michael_B哦，哇，是的。我的工作电脑上必须有一个过时版本的edge。我需要更新。

.sections-container .content-tiles-section {
  background-color: #05225E;
  .content-tiles-content {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 50px 0;
    > h2 {
      text-align: center;
    }
  }
  .content-tiles {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-around;
    align-items: stretch;
    > div {
      margin: 10px 0;
      flex: 0 1 30%;
      background-color: #FFFFFF;
      border-top-right-radius: 15px;
      border-bottom-left-radius: 15px;
      display: flex;
      flex-direction: column;
      .content-tile-image {
        flex: 0 1 100%;
        width: 100%;
        border-top-right-radius: 15px;
        border-bottom: 1px solid #D8D8D8;
      }
      .content-tile-content {
        flex: 1 1 auto;
        padding: 12px 24px;
        flex-grow: 1;
      }
      .content-tile-link {
        flex: 0 1 auto;
        padding: 12px 24px 24px 24px;
      }
    }
  }
}
.our-services .sections-container {
  .our-services-main-content-section {
    padding: 35px 15px 75px 15px;
    .intro {
      color: #005596;
      max-width: 900px;
      width: 100%;
      font-size: 2rem;
      margin: 0 auto;
      text-align: center;
    }
  }
  .content-tiles-section {
    background-color: #a40356;
  }
}