绝对父代绝对子代填充和高度

时间:2019-04-13 13:35:49

标签: html css padding

我有以下设置。父级有10px的填充(顶部保留56%的填充以保持其高度),我希望绝对的孩子继承10px的填充。我可以将子位置的顶部,左侧,右侧,底部设置为10px,但这很混乱。如果我把孩子变成亲戚,它会失去身高。在这种情况下,能否将其高度设置为与父代的高度?

.wrap {
  position: relative;
  width: 100%;
  max-width: 500px;
}

.slide {
  position: absolute;
  padding: 10px;
  background: red;
  padding-top: 56.25%;
  box-sizing: border-box;
  width:100%;
}

.content {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 10px;
  background: blue;
}
<div class="wrap">
  <div class="slide">
    <div class="content">
lorem ipsum dolor
    </div>
  </div>
</div>

0 个答案:

没有答案