css - flex換行后如何設(shè)置行距?(direction:row+warp:warp)
問題描述
效果圖.flex-container { display: flex; flex-direction: row; flex-wrap: wrap;}.flex-item { width: 33%;}html
<form role> <p class='flex-container'><p class='flex-item'> <p class='form-group'><label class='control-label'>提交類型:</label><input type='text' placeholder='請輸入內(nèi)容'/> </p></p><p class='flex-item'> <label class='control-label'>主責(zé)部門:</label> <select id='select_orderstatus'><option value='-1'>全部</option><option value='0'>行政部</option><option value='1'>IT部</option> </select></p><p class='flex-item'> <label class='control-label'>崗位:</label> <input type='text' placeholder='請輸入內(nèi)容'/></p><p class='flex-item'> <p class='form-group'><label class='control-label'>指示編號: </label><input type='text' placeholder='請輸入內(nèi)容'/> </p></p><p class='flex-item'> <label class='control-label'>指示名稱: </label> <input type='text' placeholder='請輸入內(nèi)容'/></p><p class='flex-item'> <label class='control-label'>指標(biāo)類型:</label> <select id='select_orderstatus'><option value='-1'>全部</option><option value='0'>類型1</option><option value='1'>類型2</option> </select></p> </p></form>
問題解答
回答1:flex-container里加個align-content: space-around再給個固定高度
回答2:justify-content:space-between;flex-flow:row wrap;
相關(guān)文章:
1. macos - mac下docker如何設(shè)置代理2. java - 請問在main方法中寫成對象名.屬性()并賦值,與直接參參數(shù)賦值輸錯誤是什么原因?3. MySQL數(shù)據(jù)庫中文亂碼的原因4. 關(guān)docker hub上有些鏡像的tag被標(biāo)記““This image has vulnerabilities””5. docker不顯示端口映射呢?6. docker - 各位電腦上有多少個容器啊?容器一多,自己都搞混了,咋辦呢?7. android studio總是在processes running好久8. angular.js - 關(guān)于$apply()9. docker-compose 為何找不到配置文件?10. dockerfile - 我用docker build的時候出現(xiàn)下邊問題 麻煩幫我看一下
