Search code examples
csscss3pie

CSS box-shadow in IE6,7,8


I know that its not supported ... i tried with PIE. I have put the PIE.htc file in same folder as CSS is and in the IMAGE folder. The images get loaded with no problem using the "../images/image.png" path.

Here is the code:

.ma-footer-container { 
background: #fff;
margin:0px auto; 
color: #333333; 
padding-top: 10px; 
-moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33);
-webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
behavior: url(PIE.htc);
}

And another try:

.ma-footer-container { 
background: #fff;
margin:0px auto; 
color: #333333; 
padding-top: 10px; 
-moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33);
-webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
behavior: url(../images/PIE.htc);
}

No effect whatsoever. Looks like the box-shadow gets ignored completely. Does not show in IE developer tools...

Here is another try (using absolute path). The images im using have url like: "http://www.myStore.com/skin/frontend/default/ma_kidstore/images/facebook_icon.png"

.ma-footer-container { 
background: #fff;
margin:0px auto; 
color: #333333; 
padding-top: 10px; 
-moz-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33);
-webkit-box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
box-shadow: 0 10px 80px 0 rgba(0, 0, 0, 0.33); 
behavior: url(/skin/frontend/default/ma_kidstore/images/PIE.htc);
}

Solution

  • I gave up on this a while ago. And the solution is: I dont give a rats ass about IE6,7 and 8.