Topic: Input-group problem : width in container

Zecchini premium asked 11 months ago


Hello there !

I would need some assistance regarding the use of an input-group with MDB5's select input and buttons.

Expected behavior

I would like my input-group (1 select + multiples buttons) to take the whole container's width. The same way it works with a select input from Bootstrap 5.

Actual behavior

With the MDB5's select component, the width is limited. As shown in the snippets below.

Resources (screenshots, code snippets etc.)

Currently (select from MDB5 pro) : https://mdbootstrap.com/snippets/standard/zecchini/3537760

Expected (default select from Bootstrap 5) : https://mdbootstrap.com/snippets/standard/zecchini/3537765

Thank you in advance, have a good day !


Michał Duszak staff commented 11 months ago

Hello, your snippets don't seem to work. Maybe you forgot to click 'publish' button?


Michał Duszak staff commented 11 months ago

Hello, your snippets don't seem to work. Maybe you forgot to click 'publish' button?


Zecchini premium commented 11 months ago

@Michał Duszak Sorry, is it working now ?


Michał Duszak staff answered 11 months ago


Hello, try using flex-grow: 1; on your select component. Does this work for you?

.select-wrapper {
flex-grow: 1;
}

https://mdbootstrap.com/snippets/standard/m-duszak/3545934#css-tab-view


Zecchini premium answered 11 months ago


@Michał Duszak It worked, the problem is solved ! Thank you for your time



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

  • User: Premium
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 3.10.1
  • Device: PC
  • Browser: Chrome
  • OS: Windows
  • Provided sample code: No
  • Provided link: Yes