pie.htc not fixing css3 issues

Question

I have the PIE.HTC in the root directory and trying to make rounded corners work in Internet Explorer

This is my CSS

#credits-earned
{
    border-style:solid;
    border-width:2px;
    border-color:#EDEDED;
    width:170px;
    height:60px;
    margin-bottom:10px;
    font-weight: bold;
    border-radius:8px;
    behavior: url (PIE.htc);
}

The HTML this is trying to take effect on is:

<div id="credits-earned">
                        You need to earn X<br> more credits today to avoid losing credits
                    </div>

However the rounded corners are not working in IE.

Any help be appreciated.

did you include the PIE.js file the head of document? Also PIE.htc is relative to the file not the css — Eric Goncalves, Feb 14 '13 at 15:14
open a new tab and go to your_domain/pie.htc. does it load the file? — Josh, Feb 14 '13 at 15:16
@EricLemos Lemos CSS3PIE doesn't require any js files - http://css3pie.com/documentation/getting-started/ — Josh, Feb 14 '13 at 15:29

score 0 · Answer 1 · edited May 23 '17 at 11:56

0

when including a resource in a external css file the URL is relative to the css file.

if you want to include something from a different directory you could use a relative path (example behavior:url('../PIE.htc')) or use a absolute path (example behavior:url('/PIE.htc'))

for more on path's in stylesheets - Using relative URL in CSS file, what location is it relative to?

edited May 23 '17 at 11:56

Community

1
1

answered Feb 14 '13 at 15:23

Josh

3,264
1
23
35

score 0 · Answer 2 · answered Nov 19 '13 at 12:14

0

Apart from the proper path for pie.htc to work, give:

 #credits-earned
 { position: relative;
 }

answered Nov 19 '13 at 12:14

Neeraj

132
7

pie.htc not fixing css3 issues

2 Answers2