将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标签的值,解决办 ...
随机推荐
- ORM框架为什么不流行了
程序员的逻辑是先写sql脚本,然后在编写对应的实体代码. orm框架的逻辑是先写实体代码,然后自动生成脚本,构建数据库,这和程序员的逻辑或习惯刚好相反,所以这类ORM框架渐渐的被淘汰了,例如:Hibe ...
- css3实现的鼠标经过按钮特效
今天要为各网友再带来一款css实现的鼠标经过按钮的特效.按钮初始时,边框为断开的按钮,当鼠标经过按钮时动画变为封闭的边框.效果图如下: 在线预览 源码下载 我们一起看下实现的代码: html代码: ...
- [ubuntu]E: The package firmware-upgrade needs to be reinstalled, but I can't find an archive for it.
解决办法把firmware-upgrade卸载 sudo dpkg --remove --force-all firmware-upgrade 然后 sudo apt-get update 即可
- IOS中摇一摇实现截屏(可实现问题反馈的功能)
有一段时间没有更新博客了,今天更新一篇关于最近工作中用到的一个功能,先简单描述一下:我们知道,测试人员在测试客户端产品时,当出现问题或者BUG的时候,都得先对页面截图,然后从相册中选择截图,加上一段描 ...
- windows server 2008 域控安装
windows server 2008 域控安装:1.dns安装,安装过程会提示.net frame 3.51安装 3.域控安装 原文:地址 http://wenku.baidu.com/link?u ...
- html2canvas如何在元素隐藏的情况下生成截图
html2canvas官网地址:http://html2canvas.hertzen.com/ github地址:https://github.com/niklasvh/html2canvas/ 从官 ...
- ajax回调函数中使用$(this)取不到对象的解决方法
如果在ajax的回调函数内使用$(this)的话,实践证明,是取不到任何对象的,需要的朋友可以参考下 $(".derek").each(function(){ $(this).cl ...
- ubuntu环境JDK安装(转至 http://hi.baidu.com/leo_lovato/item/31d1150d31a06d8002ce1bec)
ubuntu安装jdk 1.首先去官网http://www.oracle.com/technetwork/java/javase/downloads/index.html 下载最新版的jdk.我下载了 ...
- 转载: erlang连接mysql
转自:http://blog.csdn.net/flyinmind/article/details/7740540 项目中用到erlang,同时也用到mysql.惯例,google. 但是,按照网上说 ...
- 基于bootstrap的Dialog
function yms_Dialog(container_id, modal_path, handle_function) { /// <summary> /// ...