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

Radio buttons overlap when a long error message occurs



When a long error message occurs, radio buttons overlap and the UI is distorted. This occurs when using Pega Survey 7.22. on Pega 7.2.2.

Error Messages

Not Applicable

Steps to Reproduce

  1. Set up a question with answer as a radio button.
  2. Run the Survey.
  3. Select the answer for the first radio button.
  4. Click Submit. Ensure a validation error displays and the radio button UI is distorted. 

Root Cause

A defect in Pegasystems’ code or rules.

When an error occurs, the radio buttons overlap when they are used without displaying the label.


Perform the following local-change:
  1. Override the SimpleQuestionRadio template.
  2. Navigate to the Presentation tab of the Cell properties of radio buttons in Dynamic layout - 4.2 and 5.2.

    - Check the ‘Reserve space for label’ checkbox.
    - In the ‘Advanced Presentation Options’, define the CSS class (such as SimpleQuestionRadio) for the radio buttons. Set the height of the label (.field-caption) to 0px,.

    CSS code:

      .SimpleQuestionRadio  .field-caption {
        height: 0px;



Published August 24, 2018 - Updated December 2, 2021

Was this useful?

0% found this useful

Have a question? Get answers now.

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

Did you find this content helpful?

Want to help us improve this content?

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