Will CSS3PIE.htc be downloaded for other browsers even they don’t need?

Question

I use CSS3Pie to make round corners in IE, which uses an invalid CSS property

behavior: url(/PIE.htc); 

If I save this ad in my main CSS, will other browsers download this .htc file, even if it is not needed, or only IE will load this file?

Is it possible to save behavior: url(/PIE.htc); separate IE conditional stylesheet in terms of performance?

 <!--[if lt IE 9]> <link rel="stylesheet" type="text/css" href="ie8-and-down.css" /> <![endif]--> 

All 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); 

Answer 1

The spectrum says that browsers should completely ignore ads whose property names they do not recognize . Theoretically, this means that since behavior is a property only for IE, url() should not be parsed, and the file will not be downloaded by browsers other than IE.

I ran a test on IE9 and Firefox 4, downloading the CSS3 PIE tab demo , and this is what the F12 Developer Tools and Firebug show in their network tabs respectively. Note that Firebug does not report an attempt to request the /PIE.htc file. This means that Firefox did not load the file, even if it was declared in your stylesheet because it does not recognize the behavior property.

IE9 (F12 Developer Tools)

Firefox 4 (Firebug)

The only reason I moved this property to the IE-only stylesheet with conditional comments is if I don't want to pollute my main stylesheet with non-standard properties and / or hacks.

Answer 2

Not necessary. The behavior property is not valid for all other browsers, since -moz-border-radius refers to IE. You might want to use the latter method so that IE9 does not load behavior, but the market share is not enough to care right now.

Answer 3

Updated answer (February 2014) as it seems to be a rather obscure topic.

How it works, you start loading the HTC library through the "behavior" property.

"behavior" is only a property of IE6-9 , see the official MS website "Support for the behavior of HTML elements and components (for example, HTC) has been removed in Internet Explorer 10 standards and modes to improve HTML5 compatibility and compliance.

Therefore, the “behavior” property can cause loading only when used in IE6-9.

The library should never load for IE10 + NOR for other browsers (e.g. Chrome, Firefox, Safari, etc.)

I tested the same way as @BoltClock, and found that neither htc nor js were loaded when I was not in IE6-9 browser, as expected. I tested on IE8, IE9, Chrome 32, IE11 and Firefox 27 (see screenshots below).

I will try to spend some more time checking this further, maybe I missed something. In the meantime, anyone can test using the official demo page css3pie.com/demos/ and browserstack.com (for example, they have a free trial).

Chrome, Firefox, and IE11 do not load the css3pie js library, as expected:

Note: in the "dynamisch skripts" directory, the javascript list is added directly inside the page (does not apply to a separate js file).

IE9 loads the css3pie js library, as expected:

IE8 loads the css3pie js library, as expected:

Note 1: note that the lib loaded for IE8 or for IE9 is different.

Note 2: chrome, firefox, and IE11 do not load the css3pie library, but can load css3pie CSS, this may require further testing.