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. Docker for Mac 創建的dnsmasq容器連不上/不工作的問題2. css3 - 圖片等比例縮放3. html - css3中多列高度 統一4. javascript - 使用angular 的ui-sref 中出現了中文參數,點擊跳轉后瀏覽器的地址欄里出現轉義后的%AE....%a%45. css3 - 如何將網頁CSS背景圖高斯模糊且全屏顯示6. html5 - 這個代碼顯示功能如何實現?7. css3 - animation屬性,safari瀏覽器不支持相關效果8. javascript - 求賜教:網易郵箱Web端模擬登錄看信的加密參數_ntes_nnid、_ntes_nuid9. css - jq有無現成函數改變rotateX/Y的deg10. javascript - QWebEngineView 如何爬 angular 的動態數據?
