div元素不会从其浮动父级继承％的高度，并从其父级继承它

Question

我对下面的代码有疑问

header {
Position : absolute;
Display: inline-block;
Width: 15%;
Height: 100%;
Left: 0;
Top: 0;
}

.headerchild {
Display: block;
Width: 100%;
Padding-bottom: 20%;
Float: left;
}

Headerchildchildeader {
Position : absolute;
Display: inline-block;
Width: 80%;
Height: 100%;
Left: 20%;
}

问题是我的headerchildchild从其父父头部而不是从其父头部头部计算高度

Answer 1

我想我得到了你想要的东西。

您所要做的就是在 headerchild 子类中添加位置属性，.i.e。，

 .headerchild {
   position: relative; //newly added property
   Display: block;
   Width: 100%;
   Padding-bottom: 20%;
   Float: left;
}