lute;
    background-color: red;
    width: 100px;
    height: 100px;
    z-index: -1;
  }

  .grandchild {
    float: left;
    width: 50px;
    height: 50px;
  }

</style>

<p>Test passes if there is a filled green square and <strong>no red</strong>.
</p>
<div id=reference-overlapped-red></div>

<div
  style="display: flex; flex-flow: column-reverse wrap; width: max-content; height: 100px; background: green;">
  <div style="width: 100%; flex: 0 0 auto; min-height: 0px;">
    <div class="grandchild"></div>