Html 绝对定位子对象,在父对象上没有高度

Html 绝对定位子对象,在父对象上没有高度,html,css,position,height,Html,Css,Position,Height,我有一个绝对定位的div在一个没有高度的房间里 我需要确保子项“填充”父项内的可用高度空间,即,如果此操作正常,则将具有红色背景: (这是对我正在从事的客户项目的要求的改编…) 空白的HTML文档 部分{ 位置:相对位置; 宽度:600px; } 部门内容{ 身高:100%; 宽度:100%; 排名:0; 位置:绝对位置; 背景:红色; } Lorem ipsum dolor sit amet,是一位杰出的献身者。不要坐在汽车上,因为这是猫科动物的饮食。Nunc设施是rutrum的侵权人。Fu

我有一个绝对定位的div在一个没有高度的房间里

我需要确保子项“填充”父项内的可用高度空间,即,如果此操作正常,则将具有红色背景:

(这是对我正在从事的客户项目的要求的改编…)


空白的HTML文档
部分{
位置:相对位置;
宽度:600px;
}
部门内容{
身高:100%;
宽度:100%;
排名:0;
位置:绝对位置;
背景:红色;
}
Lorem ipsum dolor sit amet,是一位杰出的献身者。不要坐在汽车上,因为这是猫科动物的饮食。Nunc设施是rutrum的侵权人。Fusce-ligula sem,vehicula a sapien in,iaculis faucibus nulla。南福西布是一个封建的安泰,而奥纳雷·图皮斯则是一个不平等的人。不要用任何方式。白背飞虱,慈姑,黑背飞虱。比本杜姆努克元素。菲塞勒斯·阿蒂奇登特·泰勒斯(Phasellus ac tincidunt tellus)。

您没有为
部分指定高度。所以
元素具有
高度:0

因此,在
div.content
中,高度:100%
将导致
高度:0

只是不要在
div.content
CSS中包含height属性

尝试:


如果你想要达到父母身高的100%,你所需要的只是:

div.content {
width:100%; /* or left:0; right:0; */
top: 0;
bottom: 0; /* same as height:100% */
position: absolute;
background: red;
}

但如果您所在的区域没有任何高度,您可以尝试以下技巧:

section {
    display:table;
    width: 600px;
}
div.content {
    display:table-cell;
    background: red;
}

不要为div.content指定高度属性,它会起作用。是的,不要给它高度:100%;因为这是得到100%的东西。我认为我运行的砌体脚本(在生产版本上)造成了问题。是时候重新思考了!谢谢你的帮助
div.content {
width:100%; /* or left:0; right:0; */
top: 0;
bottom: 0; /* same as height:100% */
position: absolute;
background: red;
section {
    display:table;
    width: 600px;
}
div.content {
    display:table-cell;
    background: red;
}