一些CSS"bug"

1.img三像像素问题

解决办法：img{display:block;} or img{vertical-align:middle;}

问题原因：img是行内元素，默认的垂直对齐方式 baseline，下面会空出来留个 y g 这样的字母显示下面的部分。

2. ie6浮动元素2倍边距问题

解决办法：{dispaly:inline;}

问题原因：ie6下浮动元素的浮动方向和浮动边界的方向一致时会出现这个问题

3.关于外边距叠加

注意：普通文档流中的块框的崔志外边距会发生叠加。行内框、浮动框、绝对定位框之间的外边距不会。ie拥有布局的元素不会叠加。

4.ie6文本偏移3像素bug[待细研究]

解决办法：文本元素 {height:1%;margin-left 0;} 浮动元素 {margin:0;}

问题原因：文本与一个浮动元素相邻时，这个bug就会表现出来。

5.ie6绝对定位[待细研究]

解决办法： 容器{height:1%;}

问题原因：没有获取layout的元素，不创建新的上下文，绝对定位元素相对于视口进行定位

6.ie6-7拥有布局[待细研究]

注意：在InternetExplorer中，一个元素要么自己对自身的内容进行计算大小和组织，要么依赖于父元素来计算尺寸和组织内容。

.gainlayout { _height: 0; }//ie6

.gainlayout { min-height: 0; }//ie7

http://yiminghe.iteye.com/blog/367384

http://www.w3ctech.com/p/1101

http://www.cnblogs.com/radom/archive/2010/06/09/1755157.html

http://kayosite.com/internet-explorer-haslayout-in-detail.html

7.行内元素

注意：

块级元素，在浏览器中通常是垂直布局，然后可以用margin来控制块级元素之间的间距，并列和嵌套的块级元素都存在外边距，也就是margin合并的问题。

而行内元素是以水平的方式布局，垂直方向的margin，padding都是无效的，并且设置的宽高也是无效的。

8.空a元素ie无法点击

正常的display没用。

两种解决方法（主要是针对a标签不能设置背景情况）：

        1、给a标签添加样式：background:url(about:blank);

        2、给a标签随便添加背景色或者背景图片，然后将a标签的透明度设置为0，不过在IE中需要使用滤镜，即 opacity:0;filter:alpha(opacity=0);