今天做了两个inline-block元素,出现左右两个元素顶端出现上下不对齐的情况(下图):

解决办法:

把应用 inline-block的元素加上 vertical-align: top;

.CSSElement{display: inline-block; vertical-align: top;}

display:inline-block左右元素上下不对齐的更多相关文章

  1. display:inline block inline-block 的区别

    原文地址:http://blog.csdn.net/jly036/article/details/5506182 display:block就是将元素显示为块级元素. block元素的特点是: 总是在 ...

  2. 理解display:inline、block、inline-block

    要理解display:inline.block.inline-block的区别,需要先了解HTML中的块级(block)元素和行级(inline)元素的特点,行内元素也叫内联元素. 块级元素 总是另起 ...

  3. display inline or block

    一.首先要了解什么是块级元素与行级元素 块级元素 会占领页面的一行,其后多个block元素自动换行. 可以设置width,height,设置了width后同样也占领一行.同样也可以设置   margi ...

  4. display:inline、block、inline-block的区别

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度不设是它的容器的100%,除非设定一个宽度 <div& ...

  5. display:inline 跟 display:block 跟 display:inline-block区别

    我来说句人话吧.display:inline; 内联元素,简单来说就是在同一行显示.display:block; 块级元素,简单来说就是就是有换行,会换到第二行.display:inline-bloc ...

  6. HTML5 display:inline、block、inline-block的区别--备用

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  7. display:inline、block、inline-block的区别(转)

    display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度 <div& ...

  8. display:inline、block、inline-block区别

    display:inline.block.inline-block区别 display:block就是将元素显示为块级元素. display:inline就是将元素显示为行内元素. inline-bl ...

  9. display:inline、block、inline-block的区别(摘抄)

    display:inline.block.inline-block的区别 display:block就是将元素显示为块级元素. block元素的特点是: 总是在新行上开始: 高度,行高以及顶和底边距都 ...

  10. display:inline、block、inline-block三者之间的区别

    1. display:block就是将元素显示为块级元素. block元素的特点: 总是在新行上开始: 高度,行高以及顶和底边距都可控制: 宽度缺省是它的容器的100%,除非设定一个宽度:(<d ...

随机推荐

  1. jvm1

    字节码常量池: 01开头的说明是一个utf-8编码的常量,那么后面就一定要跟两个字节也就是四位16进制的数,来表示这个常量占几个字节,然后后面再跟与这个字节数对应长度的utf-8编码的字符串.之所以一 ...

  2. java SE 常用的排序算法

    java程序员会用到的经典排序算法实现 常用的排序算法(以下代码包含的)有以下五类: A.插入排序(直接插入排序.希尔排序) B.交换排序(冒泡排序.快速排序) C.选择排序(直接选择排序.堆排序) ...

  3. (转)JQM 日期插件 mobiscroll Demo

    (原)http://www.wglong.com/main/artical!details?id=11  JQM 日期插件 mobiscroll Demo 2013-04-25 / 分类:Jquery ...

  4. Qt开发环境中使用报表控件FastReport遇到的一些问题(一)

    FastReport是一款优秀的报表控件,由俄罗斯开发,国内有代理商.Qt环境下可实现报表功能的还有一款叫NCReport,也是收费控件,比较来比较去还是觉得前者功能强点.网上讲解此控件在Qt中使用的 ...

  5. SVD

    SVD分解(奇异值分解),本应是本科生就掌握的方法,然而却经常被忽视.实际上,SVD分解不但很直观,而且极其有用.SVD分解提供了一种方法将一个矩阵拆分成简单的,并且有意义的几块.它的几何解释可以看做 ...

  6. CDH自己安装方式Hbase master备份方式

    hbase-daemon.sh start master 启动改命令会默认产生Hmaster 进程,等待主机宕机,zookeepr 监控

  7. UML学习笔记

    目前转岗到业务开发,业务逻辑用到了大量的类库.UML则是理解.指导其代码实现的利器. 有6种重要的关系,按照关系的强弱排序如下: 实现 = 泛化 > 组合(关联) >聚合 > 依赖 ...

  8. systemtap

    http://www.ibm.com/developerworks/library/l-systemtap/index.html http://wiki.eclipse.org/Linux_Tools ...

  9. Android学习七:new Date使用

    1.例子 学习时间函数,并实现了简单的多个按钮监听同一个事件的方法 2.代码 代码很简单,也很清晰 package com.example.datetime; import java.text.Sim ...

  10. IIS7错误:不能在此路径中使用此配置节。如果在父级别上锁定了该节,便会出现这种情况。锁定是默认设置的(overrideModeDefault="Deny")......

    不能在此路径中使用此配置节.如果在父级别上锁定了该节,便会出现这种情况.锁定是默认设置的(overrideModeDefault="Deny")...... 解决方案: 因为 II ...