Question

我想使用不依赖于其中项目的百分比来设置div height。我在屏幕顶部有一个固定的标题和一个居中的div。但是以百分比设置高度不起作用。只有当我在那里添加一些项目时才会放大。

请帮忙。

我有这段代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>lol</title>
    <link rel="stylesheet" href="style.css"/>
</head>
<body>
<div id="conteiner">
    <header>
        <p>header</p>
    </header>
    <div id="main">
        <p>main info</p>
    </div>
</div>
</body>
</html>

这是CSS。

html{
    width: 100%;
    height: 100%;
}
body{
    overflow: hidden;
    margin: 0;
    width: 100%;
    height: 100%;
}

header{
    position: fixed;
    top: 0px;
    width: 100%;
    height: 10%;
    border: solid red 1px;
}

#main{
    display: block;
    width: 65%;
    height: 80%;
    border: solid green 1px;
    margin: 8% auto 0 auto;
}

div高度百分比即使使用100perc html和body也不起作用

0 个答案: