Topic: Problem with long labels

UNNdev priority asked 3 years ago

Expected behavior MDB should handle label truncation on its own. Also, input+button groups should not wrap by default.

Actual behavior Labels wrap and look ugly. When focusing the input, the small label that moves to the top continues to look ugly. Also, the buttons of input+button groups can wrap if there is not enough space.

Resources (screenshots, code snippets etc.) or

Grzegorz Bujański staff answered 3 years ago

Thanks for reporting this issue. We'll fix it. As a workaround use solution from this snippet:

UNNdev priority commented 3 years ago

Thanks, did something similar to that, except that for the width I used the $form-label-left variable and took that twice so it's symmetrical. So basically:

.form-outline .form-control ~ .form-label { max-width: calc(100% - #{$form-label-left * 2}) }

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: 3.2.0
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes