为什么 CSS 样式下两张图片不显示，left 样式没有宽度，虽然父元素有宽度，但只有 30% 子元素有宽度？

css 一个样式问题

问题：

这段代码中，两张图片不显示，且 left 样式没有宽度，尽管父级有宽度，并且子级的 30% 没有。请问是什么问题？

<div class="store-info">
  <div class="left">
    <img :src="img_url" class="left-img" />
  </div>
  <div class="right">
    ...
  </div>
</div>

.store-info {
  display: flex;
  height: 100px;
  padding: 10px;
  background-color: #fff;
  border-radius: 10px;
  .left {
    width: 30%;
    height: 100%;
    overflow: hidden;
    border-radius: 10px;
    margin-right: 10px;
    .left-img {
      display: flex;
      width: 100%;
      height: 100%;
    }
  }
  .right {
    flex: 70%;
    ...
  }
}

解答：

猜测问题可能出在 flex 使用不当。请提供 right 的样式，以便进一步排查。