前几天帮朋友写一个页面，今天在IE8下面发现一个很奇葩的问题，给a标签添加了float:left之后a标签内的图片不显示了，去掉float:left之后就能正常显示。

代码：

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <style type="text/css">

        img{

            max-width:100%;

            width:200px;

            border:none;

        }

        a{

            float:left;

        }

    </style>

</head>

<body>

    <a href="javascript:;"><img src="arrow-left.png"></a>

</body>

</html>

这种情况下，在IE8中图片不会显示。

通过给a标签添加border:1px solid black;可以看到边框都合并到一起了，可以看出a标签的宽度是0。

去掉 img的max-width:100%; 图片正常显示。

或者去掉img的width:200px;图片也能正常显示。

具体不知道什么原因，之后测试了一下在div下也会出现同样的问题。

IE8下标签float导致的bug。的更多相关文章

  1. angular在ie8下的一个bug

    昨天拿项目在ie8下测试,发现不少bug,其中有一个bug让我很不解,报了一个thead开头的bug,因为已经切回到linux下了,我就不报具体是什么bug了,鼓捣了半天,发现引用angular的应用 ...

  2. ie8下jquery改变PNG的opacity出现黑边,ie6下png透明解决办法

    目前互联网对于网页效果要求越来越高,不可避免的用到PNG图片,PNG分为几种格 式,PNG8 PNG24 PNG32,其中最常用的,也是显示效果和大小比较适中的则是PNG24,支持半透明,透明,颜色也 ...

  3. ie8下jquery改变PNG的opacity出现黑边

    复制网上的,没有他们那个类型的博客,所以就直接复制了 这些天在做一个效果,鼠标经过,PNG图片由透明变成不透明,jquery代 码:$(element).animate({"opacity& ...

  4. jsp页面在IE8下文本模式自动为“杂项（Quirks）”导致页面显示错位

    最近在修改网站的响应式的页面时,由于都是套样式页面,修改过程都是粘贴复制,导致了一些细节问题在IE8下暴露出来: 遇到的问题就是在在Chrome,火狐页面都正常,唯独在IE8下页面样式显示乱样了,但是 ...

  5. a标签的背景图在ie8下显示问题

    今天遇到个小问题,纠结了很久,分享下 a标签添加背景图,需要给a添加display:block样式 但是在ie8下还是不能显示背景图,开始以为是由于a标签为空造成的,试了下添加内容也没用,后来注意到一 ...

  6. a标签的背景图在ie8下不显示的问题

    突然发现临下班时候问题就多, 马上下班了被头头告知线上已经上线很久的活动现在有个兼容性问题, a标签的背景图在ie8下会有不显示的情况. 我自己找了台ie8的机器实验了一下, 发现一切正常, 但是在另 ...

  7. ie8下a标签中的图片出现边框

    1.ie8下a标签中的图片出现边框 <a href="#"><img src="horse.jpg"></a> 效果如图所示 ...

  8. # bug 查找 (一) 快速记录 IE8 下三个问题

    bug 查找 (一) 快速记录 IE8 下三个问题 昨天 pc 端网站上灰度,发现多个在 IE8 下的问题,描述和解决方案如下: 第一个问题是 css 文件过大 现象 把项目所有的 css 打包成单个 ...

  9. ie8下$(document).on('mouseover mouseout','ul li',function(){})的bug

    $(document).on('mouseover mouseout','ul li',function(){ if (event.type == 'mouseover') {           c ...

随机推荐

  1. 使用ImageMagick的convert命令，实现批量rgb转cmyk

    因为业务上的需求,使用脚本批量生成的二维码不能直接去打印店排版印刷,必须转换为cmyk的印刷格式. 首先去http://www.imagemagick.org/下载ImageMagick并安装,这个工 ...

  2. AXIS最佳实践

    前言: Axis是apache一个开源的webservice服务,需要web容器进行发布.本节主要用于介绍使用Axis开发webservice,包括服务端的创建.webservice的部署.客户端的调 ...

  3. [PHP] - Apache + PHP 环境搭建

    Apache和PHP的版本分别为: httpd-2.4.9-win64-VC11.zip php-5.6.9-Win32-VC11-x64.zip 下载地址: php-5.6.9-Win32-VC11 ...

  4. redis缓存

    参考: java对redis的基本操作 http://www.cnblogs.com/edisonfeng/p/3571870.html 一.支持类型: key:一般设计为标准的字符串, values ...

  5. Unable to create Azure Mobile Service: Error 500

    I had to go into my existing azure sql database server and under the configuration tab select " ...

  6. 自定义 Activity 的 标题栏 TitleBar

    自定义 Activity 的 标题栏 TitleBar 1. 修改标题栏的高度,背景 编辑styles.xml,添加: <?xmlversion="1.0" encoding ...

  7. svn 权限配置

    svnserve.conf开启权限 auth中以下设置 重启SVN服务

  8. 短链(ShortURL)的Java实现

    什么叫短链或短址? 就是把长的 URL 转成短的 URL, 现在提供这种服务的有很多公司,我们以google家的 URL shortener 服务: http://goo.gl/ 为例. 任何长网址都 ...

  9. [ActionScript 3.0] 分页排版

    竖排版: 横排版: /*** 分页排版 ***/ var _column:int = 5;//列数 var _row:int = 3;//行数 var _vGap:Number = 20;//行间距 ...

  10. [转载]Java程序员使用的20几个大数据工具

    最近我问了很多Java开发人员关于最近12个月内他们使用的是什么大数据工具. 这是一个系列,主题为: 语言web框架应用服务器SQL数据访问工具SQL数据库大数据构建工具云提供商今天我们就要说说大数据 ...