.GoodList{
display :table;
height :54px;
width :56px;
line-height: 14px
                padding: 0 12px
.text{
display: table-cell;
                width: 56px;
                vertical-align: middle;
                font-size: 12px;
                color: rgb(77, 85, 97); 
}
 
将父容器设为display:table然他成为一个块级表格元素，子元素display:table-cell使子元素成为表格单元格，然后就像在表格里一样，给子元素加个vertical-align: middle就行了,就可以实现多行文字垂直居中

display:table和display:table-cell结合使用的更多相关文章

  1. 由table理解display:table-cell

    转载自:https://segmentfault.com/a/1190000007007885 table标签(display:table) 1) table可设置宽高.margin.border.p ...

  2. table使用display:block时会多出一条边框

    在静态页面中添加一个table,然后设置table的显示隐藏,当使用display:block显示table时出现了如下情况,详情请点击链接: http://jsbin.com/pinovorahu/ ...

  3. display:block、display:inline与displayinline:block的概念和区别

    总体概念 block和inline这两个概念是简略的说法,完整确切的说应该是 block-level elements (块级元素) 和 inline elements (内联元素).block元素通 ...

  4. display:box和display:inline-box的区别

    display:box我想大家很熟悉,那么display:inline-box呢,今天在项目中需要设置这样的属性box-align:center,那么就想到用 display:box;如果设置BOX, ...

  5. display:inline 和display:inline-block和display:block的区别

    之前讲过块级元素使用display:block 行内元素使用display:inline 那么今天我们就来区分一下display:inline,display:inline-block和display ...

  6. OpenFlow Switch学习笔记(五)——Group Table、Meter Table及Counters

    本文主要详述OpenFlow Switch的另外两个主要组件——Group Table和Meter Table,它们在整个OpenFlow Swtich Processing中也起到了重要作用. 1. ...

  7. delete table 和 truncate table

    delete table 和 truncate table 使用delete语句删除数据的一般语法格式: delete [from] {table_name.view_name} [where< ...

  8. CSS3 display:flex和display:box有什么区别？

    **区别**,仅是各阶段草案命名.- W3C 2009年第1次草案:[display:box;](https://www.w3.org/TR/2009/WD-css3-flexbox-20090723 ...

  9. display:box；display:flex；弹性盒模型

    display:box:display:flex:弹性盒模型 非常适用于移动端.PC端高级浏览器,效果也很好. display: -webkit-box; display: -moz-box; dis ...

  10. display:flex和display:box布局浏览器兼容性分析

    display:flex和display:box都可用于弹性布局,不同的是display:box是2009年的命名,已经过时,用的时候需要加上前缀:display:flex是2012年之后的命名.在实 ...

随机推荐

  1. JSON调试找不到 net.sf.ezmorph.Morpher

    JSON中,java.lang.NoClassDefFoundError: net/sf/ezmorph/Morpher问题解决 使用JSON,在SERVLET或者STRUTS的ACTION中取得数据 ...

  2. 安卓下junit测试

    安卓下junit测试 第一种方法: 1,在AndroidManifest.xml下,加入如下红色代码 <manifest xmlns:android="http://schemas.a ...

  3. MFC控件CTabCtrl关联变量

    1.先建立一个对话框MFC应用程序,然后在工具箱里面把Tab Control控件放到对话框中的合适位置上. 再在对话框类中,将该控件绑定一个变量 用两种方法: 1 ) 自己定义成员变量 CTabCtr ...

  4. 部署OpenStack问题汇总（五）--openstack中删除虚拟主机，状态一直未deleting

    [原创文章,转载请注明出处] 一.我重启了该机器,之后想删除没有创建成功的虚拟机(没有打开cpu的vt),结果发现状态一直为deleting状态.在这个状态下创建虚拟机也失败. 二.分析:在/var/ ...

  5. php-config

    php-config php-config 是一个简单的命令行脚本用于获取所安装的 PHP 配置的信息. 在编译扩展时,如果安装有多个 PHP 版本,可以在配置时用 --with-php-config ...

  6. isolinux.cfg 文件是干什么的

    1.   首先光盘镜像也就是iso文件采用的是“ISO 9660 ”文件系统 . cd上的文件都存在这个简单的iso文件系统里,linux可以用mount  -o loop 直接把*.iso文件mou ...

  7. 使用PowerShell替代WinDbg在高分辨率笔记本下调试、排错

    最近换新的开发笔记本,分辨率较高发现部分应用在High DPI下几乎没法用.比较纠结的就是WinDbg,频繁切换分辨率.显示文字大小影响工作节奏.幸好PowerShell在High DPI下效果不错. ...

  8. 常用linux命令及shell脚本

    参考:Linux命令大全 分割大文件 Split命令 按行分割(只能是文本文件) $split -l 1000 big_file 前缀 按文件大小分割 $split -b 64m big_file 前 ...

  9. 经典 mysql 28道题

    1.登陆MySQL数据库. mysql -uroot -pdadong123 2.查看当前登录的用户. select user(); select user from mysql.user; 3.创建 ...

  10. Docker 学习应用篇之二： Docker的介绍和安装

    之前说过Docker的好处,Docker可以集装箱化的部署应用程序.那么Docker是通过什么实现的呢.要理解Docker内部构建,需要先理解Docker的四种部件 1)images:镜像,docke ...