取消“display:inline-block 相邻元素间有4px的空白间距”

Demo:http://jsfiddle.net/JSDavi/p6gcx6nx/

例子:

<div sytle="display:inline-block; width:25%;background-color:blue;">aaaaaa</div>

<div sytle="display:inline-block; width:50%;background-color:red;">bbbbbb</div>

<div sytle="display:inline-block; width:25%;background-color:green;">ccccccc</div>

解决方案:

1、清除(inline-block)元素“</div>”和“<div>”的空白,

即上一元素的结束标签和下一元素的开始标签中不能出现空格、换行、内容,

只可能是注释;

2、对inline-block的父元素添加font-size:0;,对inline-block元素及兄弟元素各自设置font-size大小;

3、去掉display:inline-block,或改为display:block,并添加float:left;

CSS - display:inline-block 相邻元素间有4px的空白间距的更多相关文章

  1. CSS——display(Block none inline等)属性的用法

    在一般的CSS布局制作时候,我们常常会用到display对应值有block.none.inline这三个值.下面我们来分别来认识和学习什么时候用什么值.这里通过CSS display知识加实例.图演示 ...

  2. CSS display:inline-block的元素特点:

    将对象呈递为内联对象,但是对象的内容作为块对象呈递.旁边的内联对象会被呈递在同一行内,允许空格. 在CSS中,块级对象元素会单独占一行显示,多个block元素会各自新起一行,并且可以设置width,h ...

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

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

  4. CSS display:inline和float:left两者区别探讨

     本文和大家重点讨论一下CSS display:inline和float:left两者的区别,CSS display是指显示状态,inline表示内联,特点是紧贴着前一个内联元素,通常默认的内联元素有 ...

  5. [CSS3] CSS Display Property: Block, Inline-Block, and Inline

    Understanding the most common CSS display types of block, inline-block, and inline will allow you to ...

  6. 用Scala实现集合中相邻元素间的差值

    欢迎转载,转载请注明出处,徽沪一郎. 概要 代码这东西,不写肯定不行,新学Scala不久,将实际遇到的一些问题记录下来,日后也好查找. 今天讲的是如何计算同一集合中元素两两之间的差值,即求开始集合(a ...

  7. css 给inline和inline-block元素设置margin和padding

    经过简单的测试,行内元素或者行内块元素的maring-left,margin-right,padding-left,padding-right都是可以正常表现的,下面来看一下剩下的margin-top ...

  8. css display:inline

  9. DIV CSS display(block,inline,none)的属性教程

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

随机推荐

  1. SQL Server 2008 复制到MySQL

    SQLServer2008正在配放订阅的时候是能够看到收撑订阅办事器为Oracle或者DB2的,可是复制到MySQL没无间接的界面操做. 颠末测试,通过MySQL的ODBC驱动,是能够实现将SQLSe ...

  2. 使用PSI-probe监控tomcat7

    http://www.lambdaprobe.org/ http://blog.csdn.net/tanglei6636/article/details/70169153 http://blog.cs ...

  3. Linux文件查找命令find(转)

    Linux find命令用来在指定目录下查找文件.任何位于参数之前的字符串都将被视为欲查找的目录名.如果使用该命令时,不设置任何参数,则find命令将在当前目录下查找子目录与文件.并且将查找到的子目录 ...

  4. 对VC++的OO思考

    1. MFC借助C++的优势为Windows开发开辟了一片新天地,同时也借助 ApplicationWizzard使开发者摆脱离了那些每次都必写基本代码2. 借助ClassWizard和消息映射使开发 ...

  5. 火狐Vimperator插件

    http://www.iplaysoft.com/vimium-and-vimperator.html http://wangbixi.com/x2923/comment-page-1/

  6. spring属性的三种注入方法

    (1)使用set方法: public class Book {  private String bookname;public void setBookname(String bookname) {  ...

  7. Gym-101915C Shahhoud Training Hussain 模拟

    题面 题意:每天有K本书,你最多看P本一天,问N天后多少本书没有看 题解:ans=(K-P)*N; 注意一点就是P>=K的时候,ans=0; #include<bits/stdc++.h& ...

  8. Wannafly挑战赛25 C 期望操作数 数学

    题目 题意:给你你一个数x和一个数q,x<=q,每一次可以等概率把x变成[x,q]中任意一个数,问变成q的步数的期望,输出对998244353取模,多组询问 题解:首先肯定的是,可以预处理,因为 ...

  9. Wannafly挑战赛25 A 因子 数学

    题面 题意:令 X = n!,给定一大于1的正整数p,求一个k使得 p ^k | X 并且 p ^(k + 1) 不是X的因子,n,,p(1e18>=n>=1e4>=p>=2) ...

  10. FZU2150 Fire Game

    题目: 两个熊孩子在n*m的平地上放火玩,#表示草,两个熊孩子分别选一个#格子点火,火可以向上向下向左向右在有草的格子蔓延,点火的地方时间为0,蔓延至下一格的时间依次加一.求烧完所有的草需要的最少时间 ...