Posted in HTML / CSS onAugust 05, 2022
需求:
el-form 每行显示两列,底部按钮居中
问题:
以前的解决办法是: el-col
, el-row
。但是这里只有一个 el-form-item
的 label
数据是已知的,其余项都是循环得到的,数量不固定,因此不能采用 el-col
方式。
尝试
尝试过 item 左浮动,flex
,底部定位,都无法解决。
解决办法
el-form 添加 inline
属性,给每个 item 设置宽度;给底部按钮 flex
布局。
参考链接
https://www.3water.com/article/240039.htm
思考说明 el-form 本身是 block
块级元素;对 flex
和 定位的详细内容不是很熟悉,比如 flex:1
到此这篇关于el-form每行显示两列底部按钮居中效果的实现的文章就介绍到这了,更多相关el-form底部按钮居中内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章,希望大家以后多多支持三水点靠木!
el-form每行显示两列底部按钮居中效果的实现
- Author -
shayloyuki声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@