I'm using CSS3Pie to make round corners in IE which uses invalid CSS property
behavior: url(/PIE.htc);
If i keep this declarition in my main CSS will other browsers load this .htc file even they don't need this or only IE will load this file?
Is there any benefit to keep behavior: url(/PIE.htc);
is seperate IE conditional stylesheet in terms of performance?
<!--[if lt IE 9]>
<link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->
The whole code is like this
border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
background: #EEFF99;
behavior: url(/PIE.htc);
The spec says that browsers are to completely ignore declarations whose property names they don't recognize. This means, theoretically, that since behavior
is an IE-only property, the url()
should not be parsed, and the file not be downloaded by browsers other than IE.
I ran a test on IE9 and Firefox 4, loading the CSS3 PIE tabs demo, and here's what F12 Developer Tools and Firebug show respectively in their network tabs. Notice that Firebug reports no attempt to request the /PIE.htc
file. That means Firefox didn't load the file even though it was declared in your stylesheet, because it doesn't recognize the behavior
property.
IE9 (F12 Developer Tools)
Firefox 4 (Firebug)
The only reason I'd move that property to an IE-only stylesheet with conditional comments is if I don't want to pollute my main stylesheet with non-standard properties and/or hacks.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With