bottom padding ignored when height > max

I've got a container div with some padding around its content, a max height with overflow: auto , and some buttons at the bottom of the container. When the contents of the container grow enough so that a scrollbar appears, the bottom padding just disappears. This happens in seemingly every browser but Chrome.

.container {
  border: 1px solid;
  padding: 15px;
  max-height: 200px;
  overflow-y: auto;
  
  display: inline-block;
  width: 200px;
}

.footer {
  background: green;
}

<div class="container">
  <div style="height: 100px">Hello World</div>
  <div class="footer">Footer Stuff</div>
</div>

<div class="container">
  <div style="height: 200px">Hello World</div>
  <div class="footer">Footer Stuff</div>
</div>

链接地址: http://www.djcxy.com/p/88422.html

上一篇: 为什么我的<div>离开他们的父母<div>？

下一篇: 当height> max时忽略底部填充