CSS高度（百分比），父级自动设置和px中的同级设置不起作用

Question

我想要一个具有自动高度的父级，一个以px为单位的高度和以百分比为单位的元素的同级。我唯一的想法行不通，我也没有其他想法可以做到这一点。我尝试了此操作（但元素高度为0；我希望它为同级/父级高度的90％）：

#parent {
  height:auto;
  width:100%;
  background:blue;
}
#element {
  height:90%;
  width:50%;
  background:black;
}
#sibling {
  height:400px;
  width:50%;
  background:red;
}

<div id="parent">
  <div id="element"></div>
  <div id="sibling"></div>
</div>

我该怎么做？