父div为min-height,将child的高度设为父级

时间:2014-12-19 12:30:29

标签: css

所以我有2个div,其中一个用最小高度制作,第二个,在第一个内部,即将获得他父母的高度,但那不是真正发生的事情,因为没有min的高度是工作,但我需要最小化它。
所以这就是我所做的代码:

<div style="background:red; width:100px; min-height:calc(100% - 50px);position:absolute;">
<div style="background:yellow; width:100px; height:100%;">Yellow</div>
</div>

并且它不能正常工作(黄色块必须是父级的100%)。 另外,我不想让黄色的一个绝对,因为我希望他的身高能影响他的父母。

1 个答案:

答案 0 :(得分:0)

由于孩子的大小与父母一样,你也可以绝对定位。

&#13;
&#13;
* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.red {
  background: red;
  min-height: calc(100% - 50px);
  position: absolute;
  width: 100px;
}
.yellow {
  background: yellow;
  width: 100px;
  height: 100%;
  position: absolute;
}
&#13;
<div class="red">
  <div class="yellow">Yellow</div>
</div>
&#13;
&#13;
&#13;