如何使用垂直滚动条构建自动调整大小的字段集

Question

假设我们正在构建一个带有字段集和其他控件的边栏。

// It is a react component.
const Sidebar = () => (
  <>
    <fieldset>
      <legend>abc</legend>
      <div>
        {data.map(d => <checkbox />)}
      </div>
    </fieldset>
    <OtherControl0 />
    <OtherControl1 />
  </>
);

该字段集是自动调整大小的，这意味着它的高度占用了侧边栏的其余空间。而且，该字段集中有很多复选框，这意味着在必要时可能需要垂直滚动条。

问题是：如何编写可以满足要求的css？

注意：使用自动滚动条可以轻松构建固定大小的字段集。但是对于具有自动滚动条的自动调整大小的字段集，似乎几乎是不可能的。