实例:

  <head>
        <style type="text/css">
            span{display: inline-block;height: 15px; line-height: 15px;}
            .span1{width: 3px;background-color: #ccc;}
            .span2{background-color: #ccc; font-size: 12px;}
            .span3{width: 2px; background-color: #ccc;}
        </style>
    </head>
    <body>
        <span>
            <span class="span1"></span>
            <span class="span2">aaaa</span>
            <span class="span3"></span>
        </span>
    </body>

当设置font-size之后,原本垂直居中的三个inline-block的元素,会变的不再垂直居中。

解决方案:

  1、span{display: inline-block;height: 15px; line-height: 15px; float:left;}

  2、.span1{width: 3px;background-color: #ccc; vertical-align: middle;}
            .span2{background-color: #ccc; font-size: 12px; vertical-align: middle;}
            .span3{width: 2px; background-color: #ccc; vertical-align: middle;}

疑问:

  font-size为什么会对排列展示产生影响?

最新文章

  1. 微信小程序-提示框
  2. Windows出现带空格文件名无法删除
  3. HTTP调试工具扩展
  4. IOS基础——IOS学习路线图(一)
  5. Linux 的使用基础---Linux的常用命令
  6. 百度编辑器ueditor 使用
  7. [RxJS] Filtering operators: skipWhile and skipUntil
  8. select菜单实现二级联动
  9. iOS 首次启动画面,新装或更新用户可以通过它查看简介。
  10. 基于ARM-contexA9按键驱动开发
  11. Vue父子组件生命过程
  12. python基础-字符串(6)
  13. Maven中POM.XML详解
  14. 设计模式のTemplatePattern(模板模式)----行为模式
  15. Navicat for Mysql连接mysql数据库时出现 2003-Can&#39;t connect to MySql server on &#39;localhost&#39;(10061)
  16. mybatis在控制台打印sql语句
  17. Go语言编程 (许式伟 等 著)
  18. 前端组件化Polymer入门教程(7)——Local DOM
  19. Oracle 用脚本安装第二个数据库
  20. 查看内核页表kernel_page_tables (aarch32)

热门文章

  1. CentOS-6.4-minimal版中安装MongoDB-x86_64-3.0.2
  2. DataRowState、AcceptChanges、RejectChanges综合使用示例:实现DataGridView数据的增、删、改
  3. windows rails new demo时候出错Make sure that `gem install mysql2 -v &#39;0.3.15&#39;` succeeds before bundling.
  4. 支付宝前端开源框架Alice(解决各个浏览器的样式不一致的问题)
  5. DirectoryEntry 账户启动与停用 以及创建账户等
  6. android 编译 app
  7. e621. Activating a Keystroke When Any Child Component Has Focus
  8. 使用ffmepg的lib库调试,debug版本下调试无问题,但release版本会出现跑飞的现象
  9. 使用什么工具连接MySQL Server
  10. C# 将RichTextBox中内容的文档以二进制形式存