最小高度百分比不能嵌套

Question

＆＃13;

＆＃13;

#background {
  background-color: #F00;
  height: 100px;
}

#outer {
  background-color: #0f0;
  min-height: 100%;
}

#inner {
  background-color: #00F;
  min-height: 100%;
}

＆＃13;

<div id="background">
  <div id="outer">
    <div id="inner">
    </div>
  </div>
</div>

＆＃13;

＆＃13;

＆＃13;

#outer div的全高为100px，但#inner div的高度为0px。为什么最小高度百分比不能嵌套？

在Firefox和Chromium上测试

This question询问同样的事情，但没有解释为什么这是预期的行为。