Maxbutton not displaying gradient in IE
-
Hi there,
Maxbutton not displaying gradient in IE.
Looks great in Firefox and Chrome but not 3D look or gradient or text shadow in IE 9. Far more people use IE than any other browsers combined so that is really important.
Any time frame when this would be fixed?
Thank you!
-
I should add that plugin is really great, awesome effects and that you can create button once and use it all over the website – that is really cool, saves a lot of time.
Just sitting here bummed, saw the IE problem today for the 1st time…
All of my pretty button just look kind of flat in IE…
Hmmm. We use CSS3 PIE to take care of most of the IE issues. When you check out the CSS, is there anything in there for -pie-background: linear-gradient() ?
Also, would love to see your web browser stats š
Yes there is code you mentioned:
a.maxbutton-2 { text-decoration: none; color: #ffffff; font-family: Arial; font-size: 12px; font-style: normal; font-weight: bold; padding-top: 2px; padding-right: 15px; padding-bottom: 2px; padding-left: 15px; background-color: #90d3ee; background: linear-gradient(#90d3ee 45%, #317f9e); background: -moz-linear-gradient(#90d3ee 45%, #317f9e); background: -o-linear-gradient(#90d3ee 45%, #317f9e); background: -webkit-gradient(linear, left top, left bottom, color-stop(.45, #90d3ee), color-stop(1, #317f9e)); border-style: solid; border-width: 1px; border-color: #47b7e3; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; text-shadow: -1px -1px 0px #47b7e3; box-shadow: 0px 0px 1px #333333; -pie-background: linear-gradient(#90d3ee 45%, #317f9e); position: relative; behavior: url("http://www.my site.com/wp-content/plugins/maxbuttons/pie/PIE.htc"); }Interesting. You may want to take a look at this known issue from CSS3 PIE: http://css3pie.com/documentation/known-issues/#content-type
Take a look and see if that helps at all.
Well knowing about the issue does not help. I am not a developer of this plugin nor do I have any way to fix the buttons.
They are just flat Whole button is the color of “begin gradient”. So you saying this is known issue and you are not fixing it? There are more topics on this forum saying buttons are not crossbrowser compatible.
Here is the page, please take a look in IE and in other browsers, you will see the difference:
IE requires that HTC behaviors are served up with a content-type header of “text/x-component”, otherwise it will simply ignore the behavior. Many web servers are preconfigured to serve the correct content-type, but others are not.
If you have problems with the PIE behavior not being applied, check your server configuration and if possible update it to use the correct content-type. For Apache, you can do this in a .htaccess file:
AddType text/x-component .htcthe suggested solution did not work. I added the test to the file but no change.
perhaps this would be helpful? people here are saying things about pie.php vs. pie.htc
I addeed this line to style.css
background: -ms-linear-gradient(#f9f9f9 50%, #ececec);So far no difference.
maybe you can guide me to apply some changes in the plugin code? It has to work in IE. Majority of people use IE.
Thanks!Can you send a link of your page?
And again, would love to see where you’re getting those statistics from.
I thought I did, sorry:
o, you mean statistics on usage of web browsers. From our clients. Not one person is using anything other than IE. Perhaps more advanced population uses Mozilla, Chrome, Opera etc but our targeted audience is with IE.
Ahhhh, that was the key bit of info I was missing. Still looking into your issue. Will hopefully have something for you soon.
I’m unable to replicate the issue in my version of IE and in Browserstack as well. The only thing I see is sometimes a quick flash of the flat button, but then it switches to the gradient.
Is this only an issue on your machine or have you tested it elsewhere?
In Browserstack it looks fine all the way back to IE6.
It now looks good.
I tested on 3 more computers, both IE 9 & 10.
I cleared cache and history on mine, it now looks good too. BOTH on the site where I added the line -ms-linear-gradient(#f9f9f9 50%, #ececec); and where I did not.
So don’t know what to make of it? I even took screenshots where it was without gradient thinking to upload here.
Thinking about it – both sites I tried buttons on hosted on the same server. So fix with .htaccess file may have been the solution and when cleared cache it kicked in on my computer?
That’s the only thing that would make sense to me, unless it was caching and old version of your CSS for some reason without the PIE added in.
Glad it’s working!
The topic ‘Maxbutton not displaying gradient in IE’ is closed to new replies.