2

This is css to use CSS3 PIE

border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 12px;
-moz-border-radius: 12px;
border-radius: 12px;
background: #EEFF99;
behavior: url(/PIE.htc);

Specially

behavior: url(/PIE.htc);

My question is will this PIE.htc be downloaded by all browser or only in IE 7 and 8?

I need to show round corner in IE7 and 8 too. So i thought instead of using Modernizr and writing another class and and image for round corner, CSS3 PIE will be good solution because whenever we will change the color and thickness of border and height of element PIE.htc will render same in IE7 and 8 without. but in the case of Modernizr and and image we will have to use upload new image for new we will have to change and upload new change.

And because I'm using Modernizr for this only I cannot load in conditional comment it will load for every browser even i don't need. So i thought if CSS3 PIE is good for flexibility and if it will only load to IE7 and 8 it will be good to use in this particular case.

Jitendra Vyas
  • 148,487
  • 229
  • 573
  • 852
  • 2
    Didn't you ask this already? Was my "detailed analysis" not enough? http://stackoverflow.com/questions/5609651/will-css3pie-htc-file-load-for-other-browsers-even-they-dont-need – BoltClock Dec 17 '11 at 16:59
  • Oh yes I forgot. now should i delete this? . But answer of michielvoo is also useful to me and I was comparing with Modernizr too in this question. Maybe I should change the title? – Jitendra Vyas Dec 17 '11 at 17:05
  • You don't have to delete this. Changing the title is fine, or if you want me to close this as a duplicate, that also works. – BoltClock Dec 17 '11 at 17:58
  • In short: YES it will load for IE9. But not for IE10+. [MS official website:](http://msdn.microsoft.com/en-us/library/ie/hh801216(v=vs.85).aspx) "Support for element behaviors and HTML components (HTCs) has been removed in Internet Explorer 10 standards and quirks modes for improved interoperability and compliance with HTML5." – Adriano Feb 07 '14 at 12:24

1 Answers1

9

behavior is not a valid CSS property and will be ignored by browsers other than Internet Explorer. They will not download the PIE.htc file.

You mention you cannot load in conditional comment, but if you can use conditional comments (?), then you can do the following trick:

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

In this case you are using conditional comments, but you are not loading anything inside the comments. You are merely adding a browser-specific class to the <html>-element. Now you can do this in your CSS:

.some-class {
  border-radius: 12px;
}
.ie7 .some-class, .ie8 .some-class {
  behavior: url(/PIE.htc);
}
Michiel van Oosterhout
  • 22,839
  • 15
  • 90
  • 132
  • I said I cannot load Modernizr in Conditional because it will not work then. Your solution seems good. – Jitendra Vyas Dec 17 '11 at 15:48
  • Is `behaviour` detectable by IE9? – Jitendra Vyas Dec 17 '11 at 15:49
  • You can't use the above example in conjunction with IE emulate modes (e.g. a `` tag). See the comments [here](http://stackoverflow.com/a/3413677/391452). – sversch Mar 20 '12 at 22:59
  • [this forum post](http://css3pie.com/forum/viewtopic.php?f=4&t=1370) says "The behavior file will never be downloaded by non-IE browsers. However, it *will* be downloaded by all IE versions". But I just tested on IE11 & it does not load PIE, which seems good. – Adriano Feb 07 '14 at 12:04
  • [On MS official website:](http://msdn.microsoft.com/en-us/library/ie/hh801216(v=vs.85).aspx) "Support for element behaviors and HTML components (HTCs) has been removed in Internet Explorer 10 standards and quirks modes for improved interoperability and compliance with HTML5." – Adriano Feb 07 '14 at 12:08