前几天帮朋友写一个页面，今天在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. html： title换行方法 如a链接标签内title属性鼠标悬停提示内容换行

    换行代码符合分别为: “&#;”和“&#;” <a href="0.shtml" title="第一排 第二排 第三排">title ...

  2. Shiro标签

    在使用Shiro标签库前,首先需要在JSP引入shiro标签: <%@ taglib prefix="shiro" uri="http://shiro.apache ...

  3. coderforces 731c

    题目大意:给出m组数据,每组数据包括两个数Li与Ri,分别表示左右袜子的索引(下标),表示这一天要穿的袜子:而我们要使得每天穿的这两只袜子的颜色相同,所以可以改变袜子的颜色,每次只能改变一只袜子的颜色 ...

  4. [译]How to Install Node.js on Ubuntu 14.04 如何在ubuntu14.04上安装node.js

    原文链接为 http://www.hostingadvice.com/how-to/install-nodejs-ubuntu-14-04/ 由作者Jacob Nicholson 发表于October ...

  5. collectionview使用

    创建UICollectionViewFlowLayout 对象来设置相关的布局,包括itemSize,headerReferenceSize,sectionInset.设置对应的布局大小,相关的和顶部 ...

  6. 关于<meta http-equiv="X-UA-Compatible" content="IE=edge" />问题

    我在做网页过程中都是在火狐浏览器下进行的,可是有一次我在IE浏览器下打开时却发现我设置的style.css中的大部分样式都失效率了,这个问题足足困扰了我两天,终于在百度的帮助下找到了答案,原来在网页的 ...

  7. korn shell

    "$*" is a single string that consists of all of the positional parameters "$@"   ...

  8. terminator 安装及使用

    1. 安装 $ sudo apt-get install terminator 2. 右键设置首选项 背景设置为0.8透明度, 字体挤在一起:在ubuntu下请选择mono后缀的字体就可以了 3. 使 ...

  9. vs2010下C++调用lib或dll文件

    注: DLL:表示链接库,包含dll,lib文件: dll: 表示my.dll文件 lib: 表示my.lib文件 C++ 调用.lib的方法: 一: 隐式的加载时链接,有三种方法 1  设置工程的 ...

  10. 扁平设备树(FDT)

    组成 扁平设备树主要由4大部分组成:头部(header),预留内存块(memory reservation block),结构块(struct block)和字符串块(strings block).这 ...