問題描述

<el-container><content-header></content-header><dashboard-content></dashboard-content><content-footer></content-footer></el-container>

布局容器<el-container>子元素未上下排列

官方文檔

https://element.eleme.cn/#/zh-CN/component/container

問題分析

Container Attributes

參數說明類型可選值默認值

direction	子元素的排列方向	string	horizontal / vertical	子元素中有?el-header?或?el-footer?時為 vertical，否則為 horizontal

?布局容器<el-container>子元素子組件有?el-header?或?el-footer?時仍然為vertical。

解決方案

添加?direction 屬性

<el-container><el-aside width="200px">Aside</el-aside><el-container direction="vertical"><el-header>Header</el-header><el-main>Main</el-main><el-footer>Footer</el-footer></el-container> </el-container> ?<el-container direction="vertical"><content-header></content-header><dashboard-content></dashboard-content><content-footer></content-footer></el-container>?

參考文章

?

總結

以上是生活随笔為你收集整理的Element UI——布局容器el-container子元素强制上下排列的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。