所以我做了一個像這樣的角形組件。我需要一個標題，一些按鈕，然后是一些按鈕，然后是一個表，然后是一個頁腳。

<my-component>
  <div>Hello I am the header</div>
  <some-stuff class="flex flex-col">I contain some buttons</some-stuff>

  <the-problem-child>
    <table>I contain a table<table>
    <div>I contain some buttons</div>
  </the-problem-child>

  <div>Hello I am the footer</div>
</my-component>

問題是，該表可以有很少或很多行，這意味著在某些情況下它會溢出& lt我的組件& gt，我想防止這種情況，而是使表格可滾動，同時保持其他所有內容可見。 由于該組件在其他組件中使用，我不能使用vh來設置最大高度。我還希望不要使用固定的高度，而是在桌子溢出之前使用所有可用的空間。

我如何在不對桌子或其他部件設置最大高度的情況下實現這一點？

我已經嘗試使用flex-box和各種屬性，但是不知道如何停止& lt問題兒童& gt防止溢出父& lt我的組件& gt因為我不想設定一個固定的高度。

您可以使用CSS屬性來適應內容，以便不與父內容重疊。

width: fit-content