All about ie bug

ie bug fix

1. Inline block doesn't work in internet explorer 7, 6 source1 source2

#yourElement {　//fix inline block
　　display: inline-block;
　　*display: inline;
　　zoom: 1;
}

2. Twitter Bootstrap Responsive layout does not work in IE8 or lower

解決方式好像是加上Respond.js source 或是ie不使用RWD設計, 讀取另一檔案去設定container固定

3. Placeholder doesn't work in ie7, ie8, ie9

解決方式: 加一段js  source

4. 雙背景ie7, ie8 doesn't work

解決方式(暫時)在html這層也加一個bg, 或是多加一層div

css for ie* version

#tip{
background: blue;
background: red; \9    //ie8, ie9都會讀, 如果ie9不要, 就加上:root #tip{...}把樣式加回去
*background: red;      //for ie7
_background: red;      //for ie6
}

css for different browsers  //各瀏覽器的前贅字  source from w3c school

nav {
　background-color: red;
　background-image: url(gradient-slice.png);
　background-image: -webkit-linear-gradient(top right, #A60000, #FFFFFF);
　background-image: -moz-linear-gradient(top right, #A60000, #FFFFFF);
　background-image: -ms-linear-gradient(top right, #A60000, #FFFFFF);
　background-image: -o-linear-gradient(top right, #A60000, #FFFFFF);
　background-image: linear-gradient(top right, #A60000, #FFFFFF);
}

The -webkit- prefixed property will work in WebKit-based browsers such as Chrome and Safari
The -moz- prefixed property will work in Firefox
The -ms- prefixed property will work in Internet Explorer
The -o- prefixed property will work in Opera

或是使用不同的檔案連結

Set a notification for ie7, ie6 users 

Here is a demo html (2014-06-27), enjoy it! (by lazyegg)
remember:
1. using ie browser to open!
2. Then push F12 see the debug bar and choose ie7 demo.

//learning from source