哈哈小老虎's Blog

项目中，一不留神就碰到了这个bug，虽未找到根本原因，但还是先和大家分享一下。。。

(全文…)

一. bug自述

我不会随便吓唬人：我只吓IE6, 7；

我的出场费也蛮高哦：给父元素A显示设定一个高度，并设置overflow（3个属性值均会失效），然后将其子元素B（inline的，block的，都可以哦）设置为相对定位。

如果这些你都能做到（你是怎么做到的？），那么：hi，很高兴认识你！

(全文…)

浮动有个比较有趣的问题: 当被浮动的元素排列成多行时(多于1行)，如果它们的高度不相同，则整个布局会被打乱(浮动布局崩溃的demo)。但有的时候，需要高度自适应，这个时候，浮动已无法胜任，也许你想到了表格，但从语义的角度来看，表格不一定适用，我想到了inline-block…

(全文…)

一. bug症状

点击包含图片的超链接, 页面并不跳转, 若图片与超链接之间存在空白, 点击空白处, 页面会跳转; 但却会响应鼠标事件.

二. bug出现的场景

a元素内嵌套一层或多层内联元素, 最终的内联元素包含一个img元素, 这时, 如果触发了a元素以内的, img元素的任何一个父元素的hasLayout, 那么超链接将失效.

(全文…)

一. 测试环境:

浏览器: IE6+, FF 3+, Chrome 4, Safari 4, Opera 10

二. 例子

<div class="a b">IE6看到黑色, 其他浏览器看到红色</div>
/* 针对其他浏览器, IE6中, 该句等价于div.b {color: red;} */
div.a.b { color: red;}
/* IE6中, 用这句进行覆盖 */
div.b { color: black;}

三. 说明

1. IE6看到黑色, 其他浏览器看到红色;

2. 非IE6中, .a.b的优先级与.a .b的优先级是一样的.