Html 如何创建具有垂直可滚动内容和固定页脚且始终可见的DIV？

HTML应该如下所示（格式和格式很抱歉，但我不知道如何发布HTML示例）

这里有什么内容…div's，ul's和li's

我想要的结果是始终只有一个垂直滚动条用于内容，并且页脚应该始终在对话框窗口的底部可见。对话框窗口是一个固定大小的对话框

---

我在这里尝试了其他帖子的一些想法，但并不符合所有要求。使用CSS（js和jquery也受欢迎）有什么想法吗

只需创建一个容器，其中包含两个div，一个用于可滚动内容，另一个用于页脚。固定所有高度并使content div可滚动

CSS（我不会为我的专业颜色选择收费）：

HTML示例

<div id="dialog-window">

  <div id="scrollable-content">
    <ul>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
    </ul>
  </div>

  <div id="footer">
  </div>

</div>

样品
样品
样品
样品
样品
样品
样品
样品
样品
样品
样品
样品
样品

此处介绍了输入/格式化代码：。您也可以直接在编辑器框中获得帮助，只需单击框右上角的橙色问号。谢谢…响应速度非常快，更重要的是，它可以工作！。看来今天我已经昏昏欲睡了。所以我把它留在这里。

<div id="dialog-window">

  <div id="scrollable-content">
    <ul>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
      <li>Sample</li>
    </ul>
  </div>

  <div id="footer">
  </div>

</div>