margin invalid (IE5 and below)
Div centered horizontally outermost IE browser setting margin: 0 auto; invalid;
- hack: body中还需要添加text-align: center;
Pictures gap
Div image of the gap (the bug occurs in IE6 and earlier versions), the div to insert the picture, the picture will stretch under the div 3 pixels;
- hack1: 将 </div>和 <img> 写在同一行;
- hack2: 将<img>转为块元素，即是添加display: block属性;
- hack3: 给父类添加font-size:0;（不推荐）
- hack4: 给<img>加float:left/right
- hack5: 给<img>加vertical-align:top
The default height (such as div)
In IE6 and earlier versions, some elements have a default height (18px height below);
- hack1: 给元素添加声明，font-size: 0;
- hack2: 给元素添加声明，overflow: hidden;
Percentage bug
In IE7 and earlier versions, when parsing a percentage, calculated will be rounded off resulting in 50% + 50% greater than 100%.
hack: 给右边的浮动元素添加声明:
clear: right; // 清除右浮动
清除浮动:
clear: right; // 清除右浮动
clear: left; // 清除左浮动
clear: both; // 清除两边的浮动
Transparent property
- IE浏览器写法: filter: alpha(opacity=value); (value取值范围0~100)
- 兼容其他浏览器写法: opacity: value; (value取值范围0~1)
Border issues
In IE6 and lower versions of the browser, if you want to remove the default border, the border need to attribute value to 0, that is compatible with multiple browsers;
bug: IE6以及更低版本浏览器中，border: none;去除不了边框；
hack: 直接使用border: 0;
Default button element sizes
- hack1: 统一大小
- hack2: input外边套一个标签，在这个标签中写按钮的样式，把input的边框去掉;
- hack3: 如果这个按钮是一个图片，直接把图片作为按钮的背景图即可;
Button resolve border issues
For there will be all browsers, buttons resolve border issues
> 设置一个div,一个按钮，一个文本输入框
> 三个高度宽度都一样，都将边框去掉，设置为左浮动
> 三个元素显示都是一致的
> 问题展示: 三个元素分别加上1px的边框，此时按钮显示会出现差异
原因:
按钮不管是否添加边框，它都是存在的，而其他元素添加边框的时，是添加在元素之外的，这也就导致其他元素都会相对应变大，而按钮却没有任何变化；
解决:
之后出现按钮和文本框一起出现且高度是一致时，要么按钮加上2px，要么文本框减去2px；
Focusing blue outer border
Input in the search input box 360's browser (compatibility mode) display, blue at the outer border of focus, while the other FF, IE, Google no blue, now require that all pages in the input box, are designed to "when the mouse focus to get the same blue outer border."
其实，是由于各个游览器的outline默认值不同导致的，解决的方法很简单，将定义outline属性为none，将下面的css代码加入相对应的选择器中。outline不会像border那样影响元素的尺寸或者位置。
hack1: input:focus{outline:none;}
hack2: input:focus{outline:0;}
Line-height form elements inconsistent
描述：表单元素行高对齐方式不一致
hack : 给表单元素添加声明：float:left;
List bug
bug1: 当给li中的a添加float: left; li没有设置浮动属性，会出现垂直效果；
hack: 给li设置浮动效果即可；
bug2: 当给li中的a转为块元素，并设置固定高度时，li是有浮动的情况下，会出现垂直效果；
hack: 给a标签添加浮动即可；
bug3: 当给li中的a转为块元素，并设置固定高度时，且有添加浮动效果，就会出现阶梯状效果；
hack: 给li中的添加浮动(即li和a都需要添加浮动);
备注:
都不设置宽度，都通过给a设置padding将li撑开;
The minimum width height
语速具备最小宽高度的自适应：IE6及以下版本不识别该属性
bug1. min-height / min-width : 最小高度(宽度)
bug2. max-height / max-width : 最大高度(宽度)
bug3. height:auto!important;(由内容撑起来)
兼容元素具备最小高度自适应的方法：
hack1. min-height:value; _height:value;（过滤器）
对于ie6来说，height本身具有min-height的作用
hack2. min-height:value; height:auto!important; height:value;(建议使用)
