IE7中a标签包含img,点击img,链接失效的bug
在做列表时,我们经常会这样写:
<ul class="works-list">
<li>
<a href="">
<div class="photo"><img src="./img/works-1.png"></div>
<p class="works-name">不安的种子</p>
</a>
</li>
<li>
<a href="">
<div class="photo"><img src="./img/works-1.png"></div>
<p class="works-name">不安的种子</p>
</a>
</li>
</ul>
在现代浏览器下点击图片或者a标签里的其他部分,均能链接到指定url,但是在ie6,ie7,部分ie8下鼠标hover到img上并没有出现鼠标的手,而且点击也没有反应。
解决方法:
推测是css样式问题,在img的父元素div上,我设置的css有:
overflow: hidden; zoom:1;width:200px; height:200px;
经查阅资料,img的父div上如果设置width和height,就会导致这种情况,去掉宽高,仍然无效,再将 overflow: hidden; zoom:1; 去掉,就可以了。由此看来,父div上不能设置任何样式。 如果其他浏览器需要 overflow: hidden; 可以添加 *overflow:visible; ,为ie低版本设置hack。
本文参考http://www.qttc.net/201210227.html
IE7中a标签包含img,点击img,链接失效的bug的更多相关文章
- 仅Firefox中A元素包含Select时点击Select不能选择option
这是在使用京东的一个日期组件时碰到的bug,重现bug的代码精简如下 <!DOCTYPE HTML> <html> <head> <title> 仅Fi ...
- IE6和IE7中<a>标签宽高设置无效的问题
昨天写了一个引导界面, 发现界面中的IE67存在一个问题, 在某些情况下, A锚链接如果设置了宽高,而且position:absolute的情况下, A标签的宽高无效, 至于总体的效果, 因为这个A ...
- 关于easyui框架中a标签使用onclick()触发事件偶尔会选项卡消失BUG解决方案
今天发现公司的一个easyui项目中有个页面会在触发onclick事件时选项卡消失,如下图 产生BUG后 产生BUG前 查找很多地方还有资料不知道哪里出现的问题,看了下框架源码之类的,因为不是专门的前 ...
- C#使用正则表达式获取HTML代码中a标签里包含指定后缀的href的值
//C#使用正则表达式获取HTML代码中a标签里包含指定后缀的href的值,表达式如下: Regex regImg = new Regex(@"(?is)<a[^>]*?href ...
- html中meta标签及用法理解
自己一直想成为高级前端开发工程师,而自学.奈何最近感觉自学收效甚微,一度迷茫. 不破不立,打算改变这样的状态. 春节后上班第一天,今年打算好好实现自己的前端梦想. 重新整理.总结前端技术. 废话,就不 ...
- 用disabled属性修饰a标签,a标签仍然能点击
1.不知道各位同学有没有遇到跟我相同的问题,就是用jQuery操作a标签disabled的,来控制重复提交表单 做过开发的都知道,表单验证重复提交,包含前端和后端,两方面的控制.前端控制使我们常用的手 ...
- 前端 -----02 body标签中相关标签
今日内容: 字体标签: h1~h6.<font>.<u>.<b>.<strong><em>.<sup>.<sub> ...
- 02-body标签中相关标签
今日内容: 字体标签: h1~h6.<font>.<u>.<b>.<strong><em>.<sup>.<sub> ...
- python 全栈开发,Day45(html介绍和head标签,body标签中相关标签)
一.html介绍 1.web标准 web准备介绍: w3c:万维网联盟组织,用来制定web标准的机构(组织) web标准:制作网页遵循的规范 web准备规范的分类:结构标准.表现标准.行为标准. 结构 ...
随机推荐
- 101个MySQL的调节和优化技巧
MySQL是一个功能强大的开源数据库.随着越来越多的数据库驱动的应用程序,人们一直在推动MySQL发展到它的极限.这里是101条调节和优化MySQL安装的技巧.一些技巧是针对特定的安装环境的,但这些思 ...
- JavaScript递归实现对象深拷贝
let personOne = { name:"张三", age:18, sex:"male", children:{ first:{ name:"z ...
- message() 信息提示
//样式部分 .message { position: fixed;top: -100px;width: 400px;left: 50%;margin-left: -200px;z-index: 10 ...
- A. Vitya in the Countryside
A. Vitya in the Countryside time limit per test 1 second memory limit per test 256 megabytes input s ...
- Golang ioutil读写文件测试
运用 ioutil.ReadFile .ioutil.WriteFile package main import ( "io/ioutil" "log" &qu ...
- destoon添加修改会员信息时,信息丢失
最近做一destoon项目,因注册字段太多,分了几个步骤.分几个页面来修改公司信息.发现有时候修改时以前保存的字段莫名丢失.. 经查是 因为member.class.php add 和 edit时, ...
- 【linux】文件默认权限:umask
在默认权限的属性上,目录与文件是不一样的.从第六章我们知道 x 权限对於目录是非常重要的! 但是一般文件的创建则不应该有运行的权限,因为一般文件通常是用在於数据的记录嘛!当然不需要运行的权限了. 因此 ...
- Python学习笔记: 闭包
闭包的基本定义 在计算机科学中,闭包(英语:Closure),又称词法闭包(Lexical Closure)或函数闭包(function closures),是引用了自由变量的函数.这个被引用的自由变 ...
- Python如何查看变量在内存中的地址
在python中可以用id()函数获取对象的内存地址. 用法: object = 1 + 2 object -- 对象
- B - CD UVA - 624
https://cn.vjudge.net/contest/224070#problem/B #include <iostream> #include <cstring> #i ...