css - flex換行后如何設置行距?(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='請輸入內容'/> </p></p><p class='flex-item'> <label class='control-label'>主責部門:</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='請輸入內容'/></p><p class='flex-item'> <p class='form-group'><label class='control-label'>指示編號: </label><input type='text' placeholder='請輸入內容'/> </p></p><p class='flex-item'> <label class='control-label'>指示名稱: </label> <input type='text' placeholder='請輸入內容'/></p><p class='flex-item'> <label class='control-label'>指標類型:</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;
相關文章:
1. python如何不改動文件的情況下修改文件的 修改日期2. angular.js - 不適用其他構建工具,怎么搭建angular1項目3. angular.js - Angular路由和express路由的組合使用問題4. python - django 里自定義的 login 方法,如何使用 login_required()5. java8中,邏輯與 & 符號用在接口類上代表什么意思6. mysql優化 - mysql count(id)查詢速度如何優化?7. mysql主從 - 請教下mysql 主動-被動模式的雙主配置 和 主從配置在應用上有什么區別?8. 主從備份 - 跪求mysql 高可用主從方案9. node.js - node_moduls太多了10. python - 關于ACK標志位的TCP端口掃描的疑惑?
