• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com专业计算机教程网站
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure
您的位置:首页 > 网页设计 >浏览器兼容 > Firefox Bug: inline/inline-block的间隙采用代码缩进可解决

Firefox Bug: inline/inline-block的间隙采用代码缩进可解决

作者:佚名 字体:[增加 减小] 来源:互联网 时间:2017-06-02

本文主要包含inline block bug,firefox bug,firefox bug下载,firefox,firefox浏览器等相关知识,佚名 希望在学习及工作中可以帮助到您
首先要说明的是,这个标题有点标题党的意思,这个 bug 也存在于 IE8 下,在 IE6 和 IE7 下正常。之前写过两篇关于 IE bug 的文章,这里特意用了 Firefox bug 作为标题,是为了给自己找点心里安慰,省得总是埋怨 IE :)。

关于 inline-block,可以参考之前的一篇文章 跨浏览器的inline-block
这个 bug 是“痛在远方”同学碰到的,确实很诡异啊,貌似对标准支持越好的浏览器才会有这个问题。本文来自前端观察,转载请以链接形式注明出处。
如下图:

在 Firefox 下,inline/inline-block 的元素直接会有莫名的几像素(貌似是6px)的空隙。这个 bug 比较难发现,因为为了美观,一般的这种设计,inline/inline-block 的元素直接都会有一定的间距,再加上目前的浏览器对 inline-block 这个属性的支持并不是很好,这个属性应用的也不是很频繁。由跨浏览器的inline-block来看,要对浏览器做不少hack,代码量以及方便性上不如直接使用浮动。因此这个 bug 的影响其实不大。

要解决这个 bug,貌似目前没有什么好的方法,只能改变代码的缩进,把换行去掉,整个代码写入一行。 </div>

您可能想查找下面的文章:

  • Firefox Bug: inline/inline-block的间隙采用代码缩进可解决

相关文章

  • 2017-06-02CSS 兼容问题
  • 2017-06-02针对chrome的css hack 使用方法
  • 2017-06-02浏览器兼容之旅第四站:IE常见Bug总结及修复方法—part2
  • 2017-06-02Firefox Bug: inline/inline-block的间隙采用代码缩进可解决
  • 2017-06-02无hack无js全兼容text-overflow-ellipsis效果
  • 2017-06-02修复网页在IE8 下的显示兼容问题
  • 2017-06-02ie6下embed标签不能播放视频问题解决方法
  • 2017-06-02IE6下图片下方有空间距的多种解决方法
  • 2017-06-02DIV+CSS 浏览器兼容性小结
  • 2017-06-02IE6支持max-width/height与min-width/height(完美解决方案)

文章分类

  • html/xhtml
  • html5
  • CSS
  • XML/XSLT
  • Dreamweaver教程
  • Frontpage教程
  • 心得技巧
  • bootstrap
  • vue
  • AngularJS
  • HBuilder教程
  • css3
  • 浏览器兼容
  • div/css
  • 网页编辑器
  • axure

最近更新的内容

    • IE6、IE7、IE8浏览器下的CSS、JS兼容性对比
    • CSS 浏览器兼容问题整理大全(比较全)
    • 关于游览器对CSS的渲染
    • CSS hack 针对IE6,IE7,firefox显示不同效果
    • 全面兼容ie6,ie7,ie8,ff的最简单的css写法
    • 区分IE6,IE7,IE8和FF的css hack
    • css实现跨浏览器的box-shadow盒阴影效果告别图片实现类似效果(2)
    • 浏览器对于含小数值px(像素)解析的差异及小数值如何解决兼容性问题
    • ie6不支持hover ie6 标签(除a标签)不支持伪类:hover解决方案
    • php的动态页面在ie内核的浏览器下面整体偏左的解决方法

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有