Notice: this information was written when Microthemer version 2 was current. On Dec 26th, 2014 version 3 was released with a completely new interface. Some of the information may be redundant, but as much of
the functionality remains the same in version 3 we haven't deleted this post.
Hi,
I’ve watched your video which explains that Microthemer uses CSS3 PIE, and so gradients should work in Internet Explorer. However, Gradients don’t seem to be working in IE7, 8 or 9.
Any help would be appreciated.
ps I have made sure that the CSS3 PIE radio button is set to “on”.
Would you be able to post a link to your website or provide me with a bit more information about what element of the web page you’re trying to apply CSS3 gradients to?
CSS3 PIE has a few known limitations: http://css3pie.com/documentation/known-issues/
Microthemer automatically handles most of these, but there are some that can’t be worked around. The “Problems on certain element types” section of the css3 pie documentation explains that certain element types don;t work with css3 pie. Most notably, the body tag can’t have css3 pie attached to it. If you try to enable CSS3 pie on the body tag, Microthemer will just ignore that setting.
OK, you’re right I was trying to add a gradient to the Body selector. gradients work on other selectors in internet explorer. So how can I apply a gradient to the whole page?
You’ve got three options, two that involve getting gradients to work the same across browsers.
1. Often, the “Wrapper” selector in the “Main Body” section of a Micro Theme can be made to fill the width of the page (as if it was the outer most element). It may already fit the width of the page without you doing anything. If so, simply apply your gradient to to “Wrapper” selector.
2. Another option is the create a gradient graphic using Photoshop or some other design tool. If you don’t own or know how to use these programs, you can find an excellent FREE online graphic creator here: http://pixlr.com/editor/. Once you’ve created your background gradient, you would upload it via the “Manage Themes” Microthemer page and then add it to the Body Selector as a background image. Note, you’ll probably want to set it to repeat-x or repeat-y depending on what direction you want to gradient to appear.
3. Gradients created with Microthemer will still render correctly on the Body selector in modern versions of Firefox, Chrome, Safari and Opera. If you’re short on time you could just accept that Internet Explorer will have a solid background colour.
