所以我有一個帶背景圖片的div，它的設置高度是:100dvh。它有兩個子元素，一些文本和一個按鈕。所以我的問題是，當一個vh小于這些元素的總和時，它們會從父元素中流出。所以我嘗試將父元素的最小高度設置為400px，但是不起作用。

您仍然可以將瀏覽器的大小調整到400像素以下，例如，按鈕將位于父元素之外。

我該如何解決這個問題？

您可以做的是將100vh設置為父容器的最小高度，這樣它至少需要100vh的高度。然后將實際高度設置為fit-content，這樣它將根據其子元素的高度進行擴展。

.parent {
  background-color: yellow;
  min-height: 100vh;
  height: fit-content;
  padding: 1rem;
}

.child-one {
  background-color: blue;
  height: 1000px;
}

.child-two {
  background-color: green;
}

<div class="parent">
  <div class="child-one">
    first child
  </div>
  <div class="child-two">
    second child
  </div>
</div>