css - 前端flex布局嵌套內層的布局不起作用?
問題描述
<!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的標簽的高度就無法自適應了?該如何解決這個問題?
問題解答
回答1:修改一下入下圖的地方
謝謝,我怎么說我項目中的代碼不起作用,原來是多個分號。。。找的我好慘
相關文章:
1. angular.js - 輸入郵箱地址之后, 如何使其自動在末尾添加分號?2. 如何解決docker宿主機無法訪問容器中的服務?3. javascript - 如何使用nodejs 將.html 文件轉化成canvas4. javascript - Web微信聊天輸入框解決方案5. angular.js - $stateChangeSuccess事件在狀態跳轉的時候不執行?6. javascript - 后臺管理系統左側折疊導航欄數據較多,怎么樣直接通過搜索去定位到具體某一個菜單項位置,并展開當前菜單7. python - Scrapy存在內存泄漏的問題。8. 如何用筆記本上的apache做微信開發的服務器9. java如何生成token?10. CSS3 畫如下圖形
