Html 使用滚动条将Div的内容垂直对齐到底部，以便溢出

我在一个固定位置的div中有可变高度的内容。在我的例子中，它是一个表，其中添加了行。我需要它将它排列在div的底部，我通过将内容位置设置为绝对底部0来实现

<div id="outer">
  <div id="inner">
    <table border="1">
      <tr>
        <td>BlahBlahBlah</td>
      </tr>
      <!-- Add more rows here. -->
    </table>
  </div>
</div>

#outer {
  position: absolute;
  top: 16px;
  left: 64px;
  right: 64px;
  bottom: 128px;
  padding-bottom: 16px;
  background: #EEEEEE;
}

#inner {
  position: absolute;
  top: 0px;
  left: 32px;
  right: 32px;
  bottom: 16px;
  overflow-y: auto;
}

table {
  width: 100%;
  /**
  This aligns content to the bottom,
  but there's never a scrollbar.*/
  position: absolute;
  bottom: 0;
}

垂直对齐似乎没有任何效果，我尝试了显示：表格单元格和显示：块。我发现获得所需对齐的唯一方法是使用绝对位置，这样做时没有滚动条

---

有人知道我如何在默认情况下使内容的底部与div的底部对齐，并使用滚动条处理溢出吗？如果有的话，我更喜欢纯CSS解决方案。

你有没有找到解决方案？如果是的话，你能把它寄出去吗？不，我没有。现在我有滚动开关。但也许你可以试试倒置的字体，然后把显示器倒过来。

#inner {
  position: absolute;
  top: 0px;
  left: 32px;
  right: 32px;
  bottom: 16px;
  overflow-y: auto;
  vertical-align: bottom;
  display: table-cell;
}