Skip to main content

Table of Contents

Adjusting layout styling by using CSS helper classes

Applicable to Theme UI-Kit applications

Apply a Cascading Style Sheet (CSS) helper class to a dynamic layout to alter the default styling or behavior in a small way, without creating a new skin format. For example, use a helper class to apply twice the standard margin to the right side of an item in the layout.

  1. On the Presentation tab of the Properties panel for the layout, select the Display advanced presentation options check box.

  2. Click the Open class editor icon for the Custom CSS class field to display the Helper class picker dialog box.

  3. Optional:

    To see a description of a helper class's effects, hover over its name in the dialog box.

  4. Optional:

    To filter helper classes by class name or description, use the search field.

    For example, you might enter right to see helper classes for adjusting the right side of an element or enter margin to see helper classes for adjusting standard margins.
  5. Select one or more helper classes to apply to the current layout, click Submit, and then click Submit on the Properties panel.

Did you find this content helpful?

Have a question? Get answers now.

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

Ready to crush complexity?

Experience the benefits of Pega Community when you log in.

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