2

I have this in my CSS:

.myAwesomeElement {
    position: relative;
    z-index: 0;
    zoom: 1;
    border: 1px solid #999;
    -webkit-border-radius: 10px;
       -moz-border-radius: 10px;
            border-radius: 10px;
    background: #6699CC;
    behavior: url(PIE.htc);
}

I have this in my HTML

 <input type="button" class="myAwesomeElement" value="#myAwesomeElement" onClick="">

The PIE.htc file is on the root directory with the HTML file.

When I view this in IE8, the button displays but it does not have rounded edges.

Am I missing something?

animuson
  • 53,861
  • 28
  • 137
  • 147
cryztal6
  • 21
  • 1

1 Answers1

1

File paths in CSS are relative to the stylesheet, not the root.

Try:

behavior: url(/PIE.htc);
Diodeus - James MacFarlane
  • 112,730
  • 33
  • 157
  • 176
  • I just tried this and it does not work either. I have read, with PIE, the file path is not to be relative from the CSS file but from the HTML file. – cryztal6 Nov 26 '12 at 21:48
  • @cryztal6 I don't think so. It's a htc file, and there is no specific rule for PIE. /PIE.htc looks correct if your file is actually in the root. – Christophe Nov 26 '12 at 22:16
  • Open up your debugger and see if you get a 404 of the .htc file when the page loads. – Diodeus - James MacFarlane Nov 26 '12 at 22:17
  • I am using the debugger in Chrome. I don't see any error message regarding the HTC file under the console tab. Of course the border-radius works fine in Chrome, I am having the issue with IE8. I am not sure if I am looking in the right place in the debugger. It says 'failed to load resource' on some images, so I think I am. – cryztal6 Nov 27 '12 at 21:41