gpt4 book ai didi

html - 将 child 定位在 parent 身上绝对没有高度

转载 作者:行者123 更新时间:2023-11-28 17:38:39 24 4
gpt4 key购买 nike

我在没有高度的内部有一个绝对定位的 div。

我需要确保 child “填满” parent 内部的可用高度空间,即如果正常工作, child 将有红色背景:http://jsfiddle.net/richardblyth/AvSr9/

(这是对我正在处理的客户元素要求的改编...)

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>A Blank HTML Doc</title>

<style type="text/css">
section {
position: relative;
width: 600px;
}
div.content {
height: 100%;
width: 100%;
top: 0;
position: absolute;
background: red;
}
</style>
</head>

<body>
<section>
<div class="content">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vehicula urna sit amet nibh facilisis, vitae feugiat felis imperdiet. Nunc facilisis ac tortor at rutrum. Fusce ligula sem, vehicula a sapien in, iaculis faucibus nulla. Nam faucibus feugiat ante, et ornare turpis aliquam vel. Donec non semper velit. Pellentesque vehicula enim lacinia, sagittis neque et, lobortis sapien. Quisque bibendum elementum nunc. Phasellus ac tincidunt tellus.</div>
</section>
</body>
</html>

最佳答案

如果你想要 parent 高度的 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;
}

关于html - 将 child 定位在 parent 身上绝对没有高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24609921/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com