Which is the CSS hack you use most often and which one do you avoid using?
Which is the CSS hack you use most often and which one do you avoid using?
I am asking this question so that I can understand different views of different people about CSS hacks and also understand which hacks are good and which ones are not.
Not technically a hack, but I often include conditional comments to target IE 7-:
<!--[if lte IE 7]>
<link href="ie7.css" />
<![endif]-->
I actually get away without using many hacks.
Most used - clear fix
Most hated - !important
rules because they are an indication that the stylesheet is probably not organized properly. It also means that some styles are too general that they ought to be. Not good for performance either.
I mostly use min-height
hack and avoid using underscore trick something like _margin
that targets IE6.
I've found that if I use the XHTML 1.0 strict doctype, mostly things just work... That said, I don't really do anything fancy... But a nice minimalistic site like SO would be pretty easy to design sans hacks...
PNG transparency in IE6 with AlphaImageLoader()...
IE versions >6 and Firefox and Chrome all support full 8-bit transparent PNGs, but for IE6 compatibility you have to do the above css hack. Your CSS file will no longer validate but if you rely on transparent PNGs like I do... it's worth it.
Most Used: Negative Margins
Seems this is the one I have to use most often: create a CSS class
.inline-block { display: inline-block; }
use it to style any element you wish to display as inline-block (instead of using display: inline-block;
directly). Then, in your IE-only (v.7 or earlier?) file:
.inline-block
{
zoom: 1;
*display: inline;
}
Sad panda.
精彩评论