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

Field size increases according to the displayed error message



The field size increases according to the displayed error message. This occurs when the Dynamic Layout is set to Inline.

Error Messages

Not Applicable.

Steps to Reproduce

  1. Create a section with TextInput field
  2. Set the dynamic layout as Inline
  3. Add some validation on the TextInput field
  4. Configure a Submit button with an OnClick action of validation evaluation

Root Cause

In dynamic layout Inline mode, the width of the individual control is respected. When an error message is displayed, it is positioned absolutely with respect to the control. Hence, the control behaves depending on the length of the error message.


Perform the following local-change:

Add the below code to either UserWorkForm or the custom CSS file:

.iconError.dynamic-icon-error {
word-wrap: break-word;
width: 200px;

If you desire to restrict this to a particular section, use
[node_name="mySection"] .iconError.dynamic-icon-error {
word-wrap: break-word;
width: 200px;

where mySection refers to the name of the section.

Adjust the width according to the requirement.
Alternatively, set max-width: 200px so that the error message does not increase in size beyond the specified width. Though, can reclaim space when there is no error message.

Suggest Edit

Published March 9, 2018 - 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