2

I'm working on my company site, mainly on impoving CSS. I would like to eliminate a lot of little images that create rounded corners, shadows and so on. CSS3 is a perfect choice, but still lot of our users use IE7 and IE8 so I need to prepare this site for them too.

I found a lot of good opinions about CSS3PIE, do I downloaded it and tried to use, but my IE8 doesn't want to cooperate :). It says: Access is denied to: PIE.htc Line: 0 Char: 0 Code: 0. I tried to put files to one folder and to differents folders, check this on the server and local... I have always the same information.

HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:og="http://opengraphprotocol.org/schema/">
<head>
<title>title</title>
<link rel="stylesheet" rev="template" type="text/css" href="styles.css">
</head>

<body id="home" class="cols_One">
<div id="wrapper" class="fauxBlock">
        <div id="header">
        <div id="cap">
        <div id="welcome"></div>
        <div id="quicklinks">abc</div>
        </div>
         </div>
    </div>
</body>
</html>

CSS:

#cap {
padding: 0 6px; 
font-size: 12px;
border-left: 1px solid #EEE;
border-right: 1px solid #EEE;
margin-bottom: 2px;
text-align: right;
line-height: 25px;
background: #fcfcfc; /*non-CSS3 browsers will use this*/
background: -webkit-gradient(linear, left top, left bottom, from(#f4f4f4) to(#fcfcfc)); /*old webkit*/
background: -webkit-linear-gradient(left top, left bottom, #f4f4f4, #fcfcfc); /*new webkit*/
background: -moz-linear-gradient(#f4f4f4, #fcfcfc); /*gecko*/
background: -ms-linear-gradient(#f4f4f4, #fcfcfc); /*IE10 preview*/
background: -o-linear-gradient(#f4f4f4, #fcfcfc); /*opera 11.10+*/
background: linear-gradient(#f4f4f4, #fcfcfc); /*future CSS3 browsers*/
-pie-background: ulinear-gradient(#f4f4f4, #fcfcfc); /*PIE*/
-moz-box-shadow: 0 2px 2px #d8d8d8;
-webkit-box-shadow: 0 2px 2px #d8d8d8;
box-shadow: 0 2px 2px #d8d8d8;
behavior:url(PIE.htc);

}

Edit: I've added code samples

John Conde
  • 217,595
  • 99
  • 455
  • 496
Kania
  • 2,342
  • 4
  • 28
  • 36
  • 1
    I think we need specifics of how you are implementing PIE CSS. I have never had any issues with it before. – Josh Mein May 24 '12 at 12:49
  • What is the structure of your webiste? What technology are you using to create it? – Josh Mein May 24 '12 at 13:13
  • It is everything. Because it doesn't work on main site I created simple example to test what is going on... But even on such simple structure (all 3 files are in the same directory) I still have problems with IE. I checked my IE settings and behavior is allowed... – Kania May 24 '12 at 13:24

3 Answers3

1

I've solved this issue changing line endings of PIE.htc to Unix (not Windows). Tested on Windows7 + IE7 and IE8.

Hope this help you!

alfonsomartinde
  • 317
  • 1
  • 10
0

If css3pie is running as a local file rather than on a web server, you need to give the full path in the behavior: property, such as:

behavior:url(C:/foo/PIE.htc);
Paul Sweatte
  • 24,148
  • 7
  • 127
  • 265
0

I tried placing PIE.htc file at the root file or next to (ex: html file). And in css file used exactly same attribute like this .yourClass{behavior: url(PIE.htc);}. Actually relate your htc file to html page rather than css file. And it worked for me. :)

varsha
  • 1,620
  • 1
  • 16
  • 29
Rahul
  • 102
  • 3