我有下面的JS和HTML代碼:

.first {
  height: 50px;
  background-color: red;
}

.second {
  height: 100px;
  background-color: green;
}

.container {
  display: grid;
  grid-template-rows: min-content;
  grid-template-columns: 265px auto;
}

<div class="container">
  <div class="first"></div>
  <div class="second"></div>
</div>

溢出需要應用于元素溢出的容器，而不是元素本身，你不會有任何溢出，因為mi n-content并不意味著所有元素的最小高度。這個屬性在處理寬度而不是高度時很有用，因為高度是默認自動的，并且在大多數情況下已經適合最小內容。

您需要的只是簡單地為容器設置一個最大高度或高度:

.first {
  height: 50px;
  background-color: red;
}

.second {
  height: 100px;
  background-color: green;
}

.container {
  display: grid;
  max-height:50px;
  overflow:hidden;
  grid-template-columns: 265px auto;
}

<div class="container">
  <div class="first"></div>
  <div class="second"></div>
</div>