Negative Margin for IE7 & IE8
Last tip was to fix the bug related to negative margin for IE…. use of zoom: 1 but today i faced another problem with negative margin its hide the div…. Here is trick use zoom:1, position: relative Problem: .container{ padding: 20px; } .toolbar{ margin-top: -10px ; } in IE red area of toolbar div hide...
Text-indent IE7, IE8 Fix
SASS code .icon text-indent: -9999px float: left display: block font-size: 0 line-height: 0 overflow: hidden Font size to 0, line height to 0 then element should be block, overflow hidden…. works on both IE7 & IE8.. OR you can use text-transform:capitalize both work
Negative margin in IE7
Some time we need a negative margin for example margin-top: -10px. This not work in IE7 Here is trick for Internet Explore 7 use zoom:1 for negative margin so your css class will become .foo{ margin-top: -10px; zoom: 1 } This will solve the problem
Transparency Mixin SASS for All Browsers
Transparency Mixin =opacity(!opacity) opacity: !opacity /* for All Good browsers */ -moz-opacity: !opacity /* for Mozilla & Netscape */ -khtml-opacity: !opacity /* for Safari & Webkit */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=" + round(!opacity*100) + ")" /* for IE 8*/ filter: "alpha(opacity=" + round(!opacity*100) + ")" /* for IE 5-7 */
IE 6 Common HTML/CSS bugs
Double margin bug/float margin bug Haslayout No Min Widths / Min Height Stepdown No Hover States No Alpha Transparent PNG Support Scroll bar problem
INefficient CSS
some prerequisite Avoid CSS expressions IE5- IE7 Support CSS expression but now in IE8 deprecated the css expression. The style system matches a rule by starting with the rightmost selector and moving to the left through the rule’s selectors. As long as your little sub-tree continues to check out, the style system will continue moving...