Skip to main content

This content has been archived and is no longer being updated. Links may not function; however, this content may be relevant to outdated versions of the product.

Support Article

Background gradient direction inconsistent between browsers



When you define a color gradient background in a skin mixin, the direction of the transition between the "start" and "stop" colors are reversed between Internet Explorer and non-Internet Explorer browsers. Internet Explorer shows the "start" color at the top or left (for vertical or horizontal gradients, respectively), while Chrome and Firefox show the "start" color on the bottom or right.

Gradient behavior in Internet Explorer

Gradient behavior in Chrome

Error Messages

Not Applicable

Steps to Reproduce

Set a background skin mixin to use a two-color gradient.

Root Cause

A defect in Pegasystems’ code or rules causes the browser specific markup for the gradients to be reversed.


Install HFix-24818.

Note: This hotfix updates the Rule-Utility-Function pzGetCSSBackground and, thus, requires the following additional steps:
  1. Regenerate the function and library on the Java tab of pzGetCSSBackground.
  2. Re-save the effected skin.

Suggest Edit

Published January 31, 2016 - Updated October 8, 2020

Did you find this content helpful? Yes No

Have a question? Get answers now.

Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.

We'd prefer it if you saw us at our best.

Pega Community has detected you are using a browser which may prevent you from experiencing the site as intended. To improve your experience, please update your browser.

Close Deprecation Notice
Contact us