需求:

el-form 每行显示两列,底部按钮居中

问题:

以前的解决办法是: el-col, el-row。但是这里只有一个 el-form-itemlabel 数据是已知的,其余项都是循环得到的,数量不固定,因此不能采用 el-col 方式。

尝试

尝试过 item 左浮动,flex,底部定位,都无法解决。

解决办法

el-form 添加 inline 属性,给每个 item 设置宽度;给底部按钮 flex 布局。

参考链接

http://t.csdn.cn/nrQ0C

思考

  1. 说明 el-form 本身是 block 块级元素;
  2. flex 和 定位的详细内容不是很熟悉,比如 flex:1

el-form 每行显示两列,底部按钮居中的更多相关文章

  1. Element UI Form 每行显示多列,即多个 el-form-item

    Element UI Form组件使用问题. 每个 el-form-item 都会独占一行. 对于输入项很多的管理app, 能否在每个form中, 每行显示 2 个或者多个 el-form-item ...

  2. flex一行显示两列(CSS)

    外层display: flex;flex-wrap: wrap; 里层 width:49%

  3. 微信小程序picker组件两列关联使用方式

    在使用微信小程序picker组件时候,可以设置属性   mode = multiSelector   意为多列选择,关联选择,当第一列发生改变时侯,第二列甚至第三列发生相应的改变.但是官方文档上给的只 ...

  4. 如何将文章列表用<li>分两列显示

    我们平时用ul或ol标签来罗列文章列表时默认是一列,为了美观起见,想把它们两列显示要如何操作呢?怎么用css定义它们? 其实相对比较简单,用几行css样式定义一下就够了,可以用div + css来控制 ...

  5. Html+Css+Js_之table每隔3行显示不同的两种颜色

    <html> <head> <script type="text/javascript"> /** 最近因项目的需求,有这样的一个问题: 一个t ...

  6. ul和li实现分两列(多列)布局显示

    简单语句实现DIV+CSS分两列(多列)布局显示 <style type="text/css"> .my ul { width: 210px; } .my li { w ...

  7. SQL两列数据,行转列

    SQL中只有两列数据(字段1,字段2),将其相同字段1的行转列 转换前: 转换后: --测试数据 if not object_id(N'Tempdb..#T') is null drop table ...

  8. 代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)

    代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到 ...

  9. 【面试总结-编程】多行两列数据,实现同key的value求和并输出

    一个文件,两列,多行. 第一列是字母,第二列是数字,同列数据之间通过空格分割. 统计首列字母相同的第二列之和. 样例输入: A 5 B 6 OO 7 A 6 A 2 OO 2 输出: A:13 B:6 ...

随机推荐

  1. 设计模式存在哪些关联关系,六种关系傻傻分不清--- UML图示详解

    前言 UML俗称统一建模语言.我们可以简单理解成他是一套符号语言.不同的符号对应不同的含义.在之前设计模式章节中我们文章中用到的就是UML类图,UML除了类图意外还有用例图,活动图,时序图. 关于UM ...

  2. Java高并发-Java内存模型和线程安全

    一.原子性 原子性是指一个操作是不可中断的.即使在多个线程一起执行的时候,一个操作一旦开始,就不会被其它线程干扰. i++是原子操作吗? 不是,包含3个操作:读i,i=i+1,写i 32位的机子上读取 ...

  3. 个人冲刺(六)——体温上报app(二阶段)

    冲刺任务:完成主页面功能 MainActivity.java package com.example.helloworld; import android.app.AlertDialog; impor ...

  4. chkconfig-配置系统服务

    管理Linux系统开机启动项. chkconfig命令默认在CentOS7+中不被使用了,由于系统服务管理都交给了systemctl托管. 语法 chkconfig [--list] [--type ...

  5. java 5种IO模型

    每日一句 人的痛苦会把自己折磨到多深呢? 每日一句 You cannot swim for new horizons until you have courage to lose sight of t ...

  6. axios的请求参数格式(get、post、put、delete)

    1.get请求方式: axios.get(url[, config]) // [字符拼接型]axios.get(url?id=123&status=0') // 等同于 axios.get(u ...

  7. CF1682F MCMF?

    题意: 费用流,其实bushi 给你长为\(n\)的序列\(a\),\(b\).\(a\)单增,\(b\)有正有负. \(q\)次询问\([l,r]\),保证\(\sum\limits_{i=l}^r ...

  8. 《Effective C++》阅读总结(三):资源管理

    C++中的资源管理非常重要,在将资源加载到内存后,便可以使用资源了,当我们不再需要资源时,我们要保证其正确的释放,才能将其占用的内存空间归还给操作系统,不正确的释放很容易造成内存泄漏.本章以资源管理类 ...

  9. VMware虚拟机基于contos 7 搭建lnmp环境全过程

    这个环境也整了几次了,由于本人比较懒,没有记住.找资料很麻烦,就自己动手咯 1.下载VMware虚拟机   (有注册码)     地址:http://www.zdfans.com/5928.html ...

  10. 25.MYsql数据库管理

    MYsql数据库管理 目录 MYsql数据库管理 数据库基本操作 库和表 常用的数据类型 查看数据表结构 查看当前服务器的数据库 查看数据库中包含的表 查看表的结构 SQL语句 创建及删除数据库和表 ...