Image replacement transparency needs importance

[barneycarroll]

Currently the premature optimisation technique fails whenever the element would have color inherited or directly specified via a selector with more precedence than the single class .ir (almost all the time, in my experience). Seeing as we can't second guess authors' methods for defining colours, important is necessary.

Explained in more detail here: aa0396e#commitcomment-1591111

[Inkdpixels]

Was also discussed here: #1108
Over the time i came to this point, and I think it covers pretty much every situation possible.

.ir {
    border: 0;
    font: 0/0 a !important;
    text-shadow: none !important;
    color: transparent !important;
    display: block;
    background-color: transparent;
}

On font: !important; - This will prevent that a dev would accidently set a higher font-size and break the layout, we could of course set overflow: hidden; - But thats not the cool way! See this testcase for reference http://jsfiddle.net/WTAhq/

[necolas]

Thanks. There is further work that need to be done on the IR technique and using !important where necessary will be part of that.