你可以使用column-count属性，它不会将column 3中的“溢出”item Package 到column 1中的新row上，就像你希望它表现的那样，而是增加container的height，并保持items的流不变。
我可以说这在可读性方面做得更好，但是我不知道你为什么希望container有一个max-height，但是如果第一个container开始溢出，你还希望在第一个container下面有一个新的container。这让我很困惑。如果你需要保留max-height，最好的选择是使用JS。
下面是使用column-count的例子。我添加了一个媒体查询的例子来使它响应，在小屏幕上column-count为1。

.back {
  background: red;
  width: 210px;
}

.container {
  column-count: 3;
  column-gap: 0;
}

.container > * {
  width: 100%;
  display: inline-block;
}

@media only screen and (max-width:600px) {
  .container {
    column-count: 1;
  }
}

<div class="back">
  <div class="container">
      <div class="day">Day 1</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="day">Day 2</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="day">Day 3</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="day">Day 4</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="day">Day 5</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="day">Day 6</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
      <div class="item">Item</div>
  </div>
</div>