<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style type="text/css" media="screen">
.box{ width: 200px; display: flex; height: 200px; background: skyblue; flex-direction: column;}
.first{ height:30px; width: 200px; background: red;}
.second{ flex-grow: 1; background: pink; style:flex;}
.third{width:100%; height: 30px; background: yellow;}
.fourth{ width: 100%; flex-grow: 1; background: gray }
</style>
</head>
<body>
<p class="box">
<p class="first"></p>
<p class="second">
<p class="third">
</p>
<p class="fourth">
</p>
</p>
</p>
</body>
</html>
这样做class为fourth的标签的高度就无法自适应了？该如何解决这个问题？
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
修改一下入下图的地方
谢谢，我怎么说我项目中的代码不起作用，原来是多个分号。。。找的我好惨