Why does setting min-width or min-height to 0 prevent CSS flex and grid overflow?

Question

I had a problem when the content inside a grid causes the whole grid to expand. I found out (somewhere I can't remember) that setting min-width or min-height to 0 prevents that issue.

body {
  padding: 0;
  margin: 0;
}

.container {
  display: grid;
  width: 90vw;
  height: 90vh;
  grid-template-areas: "left right";
  grid-template-rows: 1fr;
}

.left {
  background: green;
  grid-area: left;
  /* Without this, the whole grid's height is expanded: */
  min-height: 0;
}

.left .long-content {
  width: 50px;
  background: yellow;
  height: 110vh;
}

.right {
  background: cornflowerblue;
  grid-area: right;
}

<div class="container">
  <div class="left">
    <div class="long-content">Tall content on the left</div>
  </div>
  <div class="right">
    <p>Content Right</p>
  </div>
</div>

In this simple example, adding overflow-y: auto to .left also solves the problem, but it isn't the case for me in more complex layout. I learnt this applies for Flex as well sometimes ago.

My question is: why?

My element has content, so its width or height should already be > 0 already, why is this property changing the behavior of its parent? Will this backfire in any special case I am not aware of?