剛開始開發(fā)css或者小程序布局時, 都會遇到這樣的問題, 當我們同時使用flex布局與position:absolute/fixed的時候, 無論怎么修改都達不到最終效果, 如下圖所示:
我想在白色區(qū)域橫向布局這個四組文字, 雖然我設置display:flex, 方向也指向flex-direction:row, 但是最終顯示出來還是如左圖所示. 原因是因為白色底圖(.shape_box)布局采用的是position:fixed的形式, 這時候文字的彈性盒子布局已經(jīng)失效了, 導致達不到最終效果;
?那么如何解決這種問題呢? ?我們僅需要在白色底圖外層在套一個盒子, 然后最外層盒子使用position:fixed方式布局, 里面都是用flex布局, 效果如下圖, 就解決了這類問題;