文章詳情頁
前端 - Flex布局中容器中項目的寬度設(shè)置問題？
瀏覽：72日期：2024-06-11 11:26:33
問題描述
問題的演示地址：點擊這里
想實現(xiàn)的布局是按照2:1:1的寬度排列，但是現(xiàn)在在第三個項目中如果增加了比較多的內(nèi)容，這個項目的寬度就會隨著內(nèi)容的增加而增加，破壞了2:1:1的結(jié)構(gòu)。
我在這里看到使用flex-basis:0的方式：
.column {margin: 10px;flex-grow: 1;flex-shrink: 1;flex-basis: 0; } .column:first-of-type {flex-grow: 2;flex-shrink: 2;flex-basis: 0; }
但是我這樣設(shè)置了并沒有產(chǎn)生效果，期望的效果是這樣的：
請問下該怎樣實現(xiàn)？
問題解答
回答1：shrink設(shè)為0
回答2：width:0;完美解決
相關(guān)文章：
1. mysql 查詢身份證號字段值有效的數(shù)據(jù)2. python bottle跑起來以后,定時執(zhí)行的任務(wù)為什么每次都重復(多)執(zhí)行一次?3. 視頻文件不能播放，怎么辦？4. html5 - HTML代碼中的文字亂碼是怎么回事？5. python - 爬蟲模擬登錄后，爬取csdn后臺文章列表遇到的問題6. visual-studio - Python OpenCV: 奇怪的自動補全問題7. mysql - 分庫分表、分區(qū)、讀寫分離 這些都是用在什么場景下 ，會帶來哪些效率或者其他方面的好處8. javascript - 彈出一個子窗口，操作之后關(guān)閉，主窗口會得到相應(yīng)的響應(yīng)，例如網(wǎng)站的某些登錄界面，django后臺的管理等，這是怎么實現(xiàn)的呢？9. javascript - ios返回不執(zhí)行js怎么解決？10. android - 分享到微信，如何快速轉(zhuǎn)換成字節(jié)數(shù)組
排行榜
熱門標簽
網(wǎng)公網(wǎng)安備