View unanswered posts | View active topics It is currently Wed Dec 11, 2019 10:39 pm

Reply to topic  [ 1 post ] 
 No gradient background in IE8 [RESOLVED] 
Author Message

Joined: Wed Sep 26, 2012 9:27 am
Posts: 1
Post No gradient background in IE8 [RESOLVED]
Thanks for a great thing :)
I've ran in to a problem with IE8...

I have CSS like this:

// ....
-pie-background: linear-gradient(#5b92e6, #194b96);
behavior: url(/_layouts/Redacted.Redacted.Redacted.Branding/Main/dialog/;
// ....

This works in IE9, but not in IE8 - nothing is displayed (there are no css3-containers in the code). If I open IE dev tools, and change this to this page relative URL:

behavior: url(../_layouts/Redacted.Redacted.Redacted.Branding/Main/dialog/;

...the gradient immediatelly displays. I still can't see css3-containers in the code, I assume this is because dev tools "didn't notice" they were added. So I'm thinking obvious solution, I change the CSS file to that path instead.

// ....
-pie-background: linear-gradient(#5b92e6, #194b96);
behavior: url(../_layouts/Redacted.Redacted.Redacted.Branding/Main/dialog/;
// ....

This also works in IE9, but this still gives the same problem in IE8! If I use IE dev tools to change it back to:

behavior: url(/_layouts/Redacted.Redacted.Redacted.Branding/Main/dialog/;

The gradient shows!

So, regardless if I set the original path to server relative or HTML file relative, it doesn't work until I change it after page load to the other.

The exact same problem happens on radial corners on another div.

I'm running 1.0.0. I previously ran beta 4, that worked perfectly in IE8 only with page relative URL (../) but not at all in IE9.

All "behavior" are accompanied by a "zoom: 1;".

The bigger picture is that this is a SharePoint site, in which a jQuery.UI.dialog that has border radius and a child div containing the dialog title that has the gradient background.

Any ideas what I'm doing wrong or how I can fix/work around the problem?

EDIT: A really weird thing is, it's not as simple as changin the URL from the original to another just triggers a refresh. Let's say I have two valid URLS:
and the equally valid

If I set "xx" in CSS, it will not work until I change it to yy with IE dev tools. Here's the strange part: If I change back to "xx" using dev tools, the background will dissappear!
If I change the "original" value in the CSS from xx to yy, yy will instead be broken - it will start working if I change to xx using the dev tools, and break again if I change back to yy...

EDIT: There were a javascript error in a completely unrelated component on the page. Fixed that error, this problem went away. Leaving this in the rare chance someone else run into something similar...

Wed Sep 26, 2012 9:53 am
Display posts from previous:  Sort by  
Reply to topic   [ 1 post ] 

Who is online

Users browsing this forum: No registered users and 5 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.