将display设置为inline-block之后产生间隙然后换行问题的解决方法
在我们会用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之后产生间隙然后换行问题的解决方法的更多相关文章
- 改进动态设置query cache导致额外锁开销的问题分析及解决方法-mysql 5.5 以上版本
改进动态设置query cache导致额外锁开销的问题分析及解决方法 关键字:dynamic switch for query cache, lock overhead for query cach ...
- div+css总结—FF下div不设置高度背景颜色或外边框不能正常显示的解决方法(借鉴)
原地址:http://blog.sina.com.cn/s/blog_60b35e830100qwr2.html 在使用div+css进行网页布局时,如果外部div有背景颜色或者边框,而不设置其高度, ...
- 内层元素设置position:relative后父元素overflow:hidden overflow:scroll失效 解决方法
内层元素设置position:relative后父元素overflow:hidden overflow:scroll 都失效 解决方法:在position:relative的外层父容器加positio ...
- SVN设置忽略文件列表以及丢失了预定增加的文件解决方法
设置svn忽略列表 Linux下svn命令行配置 1. 修改版本库的相关属性 2. svn 客户端的配置 Windows下 Tortoise SVN 设置 1. Tortoise SVN 上修改版本库 ...
- HTML 文档流,设置元素浮动,导致父元素高度无法自适应的解决方法(高度欺骗)
元素浮动定义 float 属性定义元素在哪个方向浮动.以往这个属性总应用于图像,使文本围绕在图像周围,不过在 CSS 中,任何元素都可以浮动.浮动元素会生成一个块级框,而不论它本身是何种元素. 如果浮 ...
- 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 ...
- WPF中设置了WindowStyle="None"后,窗口仍然有边框的解决方法
1. 设置了窗体的WindowStyle="None",窗口还是右边框,如下图: 2. 这是因为窗体默认是可以改变大小的,所以需要修改ResizeMode的值 ResizeMode ...
- “matplotlib display text must have all code points < 128 or use Unicode strings”解决方法
import sys reload(sys) sys.setdefaultencoding('utf-8') 插入以上代码,便可解决.
- 针对标签中设置 disabled="true",$("#id").serialize()获取不到value的解决方法
今天给<select>增加disabled="true", 发现$("#form").serialize()的结果不包含select标签的值,解决办 ...
随机推荐
- curator教程二——分布式锁
简介 在分布式环境下,为了防止多个服务同时修改同一个值,出现数据同步问题,通常用redis和zookeeper做分布式锁,在这里我们用zookeeper做分布式锁,并和单点环境中ReenTranL ...
- linux命令--vi,vim
进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 vi +n filename :打开文件.并将光标置于第n行首 vi + filename :打开文件.并将光标置 ...
- Quartz 与 Spring集成
http://www.cnblogs.com/pigwing/archive/2011/07/12/2104002.html http://blog.arganzheng.me/posts/quart ...
- java资料——数据结构(转)
数据结构 (计算机存储.组织数据方式) 数据结构是 ...
- BusyBox inittab配置
inittab第一行指定初始化脚本,开启所有应用程序,必须有. ::sysinit:/etc/init.d/rcS 在第一行执行完后,执行剩余行命令,此终端要接受命令交互需开启sh. ::askfir ...
- 人脸识别技术大总结1——Face Detection & Alignment
搞了一年人脸识别,寻思着记录点什么,于是想写这么个系列,介绍人脸识别的四大块:Face detection, alignment, verification and identification(re ...
- iOS边练边学--九宫格布局
一.介绍一下ViewController中的结构 二.九宫格设计思路 三.代码实现 // 点击增加按钮 - (void)add:(UIButton *)btn { // 定义一行中的列数(个数) NS ...
- IS支持解析json
1. MIME设置:在IIS的站点属性的HTTP头设置里,选MIME 映射中点击”文件类型”-”新类型”,添加一个文件类型:关联扩展名:*.json内容类型(MIME):application/x-j ...
- 多个git账号之间的切换
在这篇文章中: 介绍 处理 一些题外话 我有一个repo,想要同时push到不同的仓库该如何设置? 我有一个github的repo,clone没有问题,push的时候总是报错:error: The r ...
- ggplot2——简介
ggplot2是R语言最为强大的作图软件包,强于其自成一派的数据可视化理念.当熟悉了ggplot2的基本套路后,数据可视化工作将变得非常轻松而有条理. 本文主要对ggplot2的可视化理念及开发套路做 ...