'MUI avoid helperText to change width of input field

I am using the helpertext of the mui textfield component to display validation errors. Unfortunately the helpertext is increasing the width of the textfield. I am using the "fullWidth" attribute.

If there is no error, no helper text is shown (image 1). If input validation fails, error is shown but the the textfield should remain the same size (image 2).

Without error, correct width

With error, wrong width



Solution 1:[1]

I had the same problem with GWT MaterialTextBox. I managed to solve my problem by setting a fixed width (e.g. 300px) for the text box.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 ladybug