Topic: Better validation feedback layout

KieranFoot free asked 1 year ago


Expected behavior

If I do NOT provide any feedback text (positive or negative), DO NOT grow the input to display empty text.

Actual behavior

The input size expands downwards ti provide space for feedback text which is empty.


Kamila Pieńkowska staff answered 1 year ago


We will take this into consideration until then you can use this CSS:

.form-control.is-valid:not(:has(~ .valid-feedback)), .was-validated .form-control:valid {
  margin-bottom: 0;
}

.form-control.is-valid:not(:has(~ .valid-feedback)), .was-validated .form-control:invalid {
  margin-bottom: 0;
}

KieranFoot free commented 1 year ago

Thanks for the assistance


Kamila Pieńkowska staff answered 1 year ago


Please read this section in the documentation: https://mdbootstrap.com/docs/standard/forms/validation/#section-how-it-works

If you do not want added space for some elements you just need to add a custom class to this element that will override its pseudo-style.


KieranFoot free commented 1 year ago

I know I can override the behaviour, my suggestion is that the default behaviour be changed when no validation text is specified. What are you making space for if no text is specified?



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Standard
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No