Tuesday, August 6, 2013

Simple way to Css Hack for IE

Css Hack for IEDue to its relatively poor level of standards support, Internet Explorer tends to be the subject of most CSS hacks.

Internet Explorer was not designed to allow multiple versions to be installed at once, and Microsoft doesn't officially support any such configurations. If you use one of the hacked third party packages that attempts to do this, you will experience problems with version-specific conditional comments, among other things. This is because the different stand-alone copies still rely on a common centralized registry for certain data, including version information.

Although there is no simple way to cut through all of the issues with stand-alone versions of Internet Explorer, it is possible to force them to look elsewhere for their version information, thus fixing this issue with conditional comments.

Here is an example:

#element {
    color:orange;
}
#element {
    *color: white;/* IE6 + 7, doesn't work in IE8/9 as IE7 */
}
#element {
    _color: red;/* IE6 */
}
#element {
    color: green\0/IE8+9; /* IE8 + 9 + IE10pp4  */
}
:root #element { color:pink \0/IE9; }  /* IE9 + IE10pp4 */


CSS hacks are usually bad. You should probably do this instead.

<!--[if lt IE 7]><html class="ie6"> <![endif]-->
<!--[if IE 7]><html class="ie7"> <![endif]-->
<!--[if IE 8]><html class="ie8"> <![endif]-->
<!--[if gt IE 8]><!--> <html><!--<![endif]--> 


This uses conditional comments to target certain versions of Internet Explorer, and the element receives a custom class name for different versions of IE, and no class name when the browser is not IE.

Then in your CSS, you would target IE7 or IE8 like this:


.element { 
    margin-bottom: 20px; 

 
.ie7 .element { 
    margin-bottom: 10px; 

 
.ie8 .element { 
    margin-bottom: 15px; 
}

5 comments:

  1. The article is good one and the example simplified to understand and use the CSS hack for IEs easily. Thanks bro !!

    ReplyDelete
  2. I ADAMS KEVIN, a representative Aiico Insurance plc, we trust and respect for individual differences in day out a loan. We will provide 2% of the loan's interest rate. If you are interested in this business contact us by e-mail: (adams.credi@gmail.com) now transfer their loan documents issued properly. Do you need a loan to set up business or school if you are very welcome to Aiico Insurance plc. You can also contact us by e-mail: (adams.credi@gmail.com). We first week can request a balance transfer.

    DO YOU NEED LOAN FOR PERSONAL BUSINESS? IF YOU CONTACT YOUR EMAIL ABOVE TO PROCEED WITH YOUR LOAN TRANSFER IMMEDIATELY OK.

    ReplyDelete