Forums
View unanswered posts | View active topics It is currently Fri Nov 28, 2014 12:50 am



Reply to topic  [ 6 posts ] 
 IE8 boxes with shadows get black outlines? 
Author Message

Joined: Wed Jan 16, 2013 5:37 am
Posts: 6
Post IE8 boxes with shadows get black outlines?
Hi,

div.panel {
background: -moz-linear-gradient(center top , #FFFFFF 0%, #F4F4F4 100%) repeat scroll 0 0 transparent;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
margin: 0 0 20px;
padding: 20px 20px 2px;
}

I have this box, and after adding behaviour PIE.htc to it, in internet explorer 8 i get a black outline instead of the normal shadow.

In ie7 however the shadow is normal. What could be the problem? If you want pictures of the problem, ask me.

Re.


Wed Jan 16, 2013 5:40 am
Profile

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1446
Post Re: IE8 boxes with shadows get black outlines?
Pictures would help, or better yet a URL.

Note that rgba alpha doesn't work for shadows with blur.


Wed Jan 16, 2013 6:19 pm
Profile

Joined: Wed Jan 16, 2013 5:37 am
Posts: 6
Post Re: IE8 boxes with shadows get black outlines?
I uploaded screens, since my web is not live and no way doing it so at the moment. I don't know why this happens. Notice the black outline in IE8 and normal shadow in IE7.


Attachments:
File comment: This is set to IE7 standard mode via F12.
ScreenShot008.png [24.91 KiB]
Not downloaded yet
File comment: this is how the box looks like in firefox.
ScreenShot006.png [26.49 KiB]
Not downloaded yet
File comment: This is Internet Explorer 9 set on IE8 standard mode via F12. Notice black outline that pie does.
ScreenShot007.png [34.01 KiB]
Not downloaded yet
Thu Jan 17, 2013 4:37 am
Profile

Joined: Wed Jan 16, 2013 5:37 am
Posts: 6
Post Re: IE8 boxes with shadows get black outlines?
Another example posted screenies. See after clicking refresh 5 times, it renders normally. How to solve this?

.mytabs {
background-color: #F8F8F8;
border-radius: 10px 10px 10px 10px;
box-shadow: 0 0 6px #C3C3C3;
height: 468px;
margin-bottom: 20px;
margin-top: 15px;
overflow: hidden;
position: relative;
text-transform: uppercase;
width: 100%;
behavior: url(../assets/js/pie/PIE.htc);
}

This is the main part of css


Attachments:
File comment: After pressing Refresh (f5) like 5-6 times.. it renders normally..
ScreenShot010.png [32.63 KiB]
Not downloaded yet
File comment: Another example.. first time i open this page containing this element. It show such border (grey).
ScreenShot009.png [37.65 KiB]
Not downloaded yet
Thu Jan 17, 2013 4:46 am
Profile

Joined: Wed Jan 16, 2013 5:37 am
Posts: 6
Post Re: IE8 boxes with shadows get black outlines?
works normal using the javascript version of PIE , so it must be some load timing problem when execution of jquery and rest of js happens, basicly PIE has to be the last step judging by princip i used to load the JS version. But seems that .htc inside css does this before some other js\jquery happens. This might be the problem


Thu Jan 17, 2013 6:16 am
Profile

Joined: Wed Jul 14, 2010 11:46 am
Posts: 1446
Post Re: IE8 boxes with shadows get black outlines?
The IE8 mode in IE9's developer tools isn't an accurate rendering, I've seen users with all sorts of strange rendering issues trying to use it. You really should be testing in a real IE8 install, it's very possible that your black outline issue is an artifact of the fake IE8.


Thu Jan 17, 2013 9:34 pm
Profile
Display posts from previous:  Sort by  
Reply to topic   [ 6 posts ] 

Who is online

Users browsing this forum: No registered users and 3 guests


You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot post attachments in this forum

Search for:
Jump to:  
Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group.
Designed by STSoftware for PTF.