在我们会用display的时候,inline-block肯定不陌生吧,我今天在做项目的时候,用了inline-block,使a标签可以自定义宽度,但是随之而来的问题就是换行的BUG,如下图

特地加了一个border来看其间距,果不其然,会产生一定的间隙

解决方法1:浮动

没有什么是浮动解决不了的,如果有的话,那就用两次,在每个a标签上加个float:left,完美解决

解决方法2:父级元素font-size:0

这个方法比较偏一点,也是今天从我们老大那里刚刚得知的,css果然许多学问,

html{
  -webkit-text-size-adjust:none;/* 使用webkit的私有属性,让字体大小不受设备终端的调整,可定义字体大小小于12px */
}
父级元素{
font-size:0;/* 所有浏览器 */
*word-spacing:-1px;/* 使用word-spacing 修复 IE6、7 中始终存在的 1px 空隙,减少单词间的空白(即字间隔) */
}
子元素{
font-size: 12px;
letter-spacing: normal;/* 设置字母、字间距为0 */
word-spacing: normal; /* 设置单词、字段间距为0 */
}

  完美解决!

将display设置为inline-block之后产生间隙然后换行问题的解决方法的更多相关文章

  1. 改进动态设置query cache导致额外锁开销的问题分析及解决方法-mysql 5.5 以上版本

    改进动态设置query cache导致额外锁开销的问题分析及解决方法 关键字:dynamic switch for query cache,  lock overhead for query cach ...

  2. div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)

    原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...

  3. 内层元素设置position:relative后父元素overflow:hidden overflow:scroll失效 解决方法

    内层元素设置position:relative后父元素overflow:hidden overflow:scroll 都失效 解决方法:在position:relative的外层父容器加positio ...

  4. SVN设置忽略文件列表以及丢失了预定增加的文件解决方法

    设置svn忽略列表 Linux下svn命令行配置 1. 修改版本库的相关属性 2. svn 客户端的配置 Windows下 Tortoise SVN 设置 1. Tortoise SVN 上修改版本库 ...

  5. HTML 文档流,设置元素浮动,导致父元素高度无法自适应的解决方法(高度欺骗)

    元素浮动定义 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素. 如果浮 ...

  6. mount: block device /dev/cdrom is write-protected, mounting read-only 解决方法

    [root@localhost ~]# mount /dev/cdrom /mnt/cdrom/ mount: block device /dev/sr0 is write-protected, mo ...

  7. WPF中设置了WindowStyle="None"后,窗口仍然有边框的解决方法

    1. 设置了窗体的WindowStyle="None",窗口还是右边框,如下图: 2. 这是因为窗体默认是可以改变大小的,所以需要修改ResizeMode的值 ResizeMode ...

  8. “matplotlib display text must have all code points < 128 or use Unicode strings”解决方法

    import sys reload(sys) sys.setdefaultencoding('utf-8') 插入以上代码,便可解决.

  9. 针对标签中设置 disabled="true",$("#id").serialize()获取不到value的解决方法

    今天给<select>增加disabled="true", 发现$("#form").serialize()的结果不包含select标签的值,解决办 ...

随机推荐

  1. curator教程二——分布式锁

    简介   在分布式环境下,为了防止多个服务同时修改同一个值,出现数据同步问题,通常用redis和zookeeper做分布式锁,在这里我们用zookeeper做分布式锁,并和单点环境中ReenTranL ...

  2. linux命令--vi,vim

    进入vi的命令  vi filename :打开或新建文件,并将光标置于第一行首  vi +n filename :打开文件.并将光标置于第n行首  vi + filename :打开文件.并将光标置 ...

  3. Quartz 与 Spring集成

    http://www.cnblogs.com/pigwing/archive/2011/07/12/2104002.html http://blog.arganzheng.me/posts/quart ...

  4. java资料——数据结构(转)

    数据结构 (计算机存储.组织数据方式)                                                                            数据结构是 ...

  5. BusyBox inittab配置

    inittab第一行指定初始化脚本,开启所有应用程序,必须有. ::sysinit:/etc/init.d/rcS 在第一行执行完后,执行剩余行命令,此终端要接受命令交互需开启sh. ::askfir ...

  6. 人脸识别技术大总结1——Face Detection & Alignment

    搞了一年人脸识别,寻思着记录点什么,于是想写这么个系列,介绍人脸识别的四大块:Face detection, alignment, verification and identification(re ...

  7. iOS边练边学--九宫格布局

    一.介绍一下ViewController中的结构 二.九宫格设计思路 三.代码实现 // 点击增加按钮 - (void)add:(UIButton *)btn { // 定义一行中的列数(个数) NS ...

  8. IS支持解析json

    1. MIME设置:在IIS的站点属性的HTTP头设置里,选MIME 映射中点击”文件类型”-”新类型”,添加一个文件类型:关联扩展名:*.json内容类型(MIME):application/x-j ...

  9. 多个git账号之间的切换

    在这篇文章中: 介绍 处理 一些题外话 我有一个repo,想要同时push到不同的仓库该如何设置? 我有一个github的repo,clone没有问题,push的时候总是报错:error: The r ...

  10. ggplot2——简介

    ggplot2是R语言最为强大的作图软件包,强于其自成一派的数据可视化理念.当熟悉了ggplot2的基本套路后,数据可视化工作将变得非常轻松而有条理. 本文主要对ggplot2的可视化理念及开发套路做 ...