mdb-select inside modal not working properly

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: mdb-select inside modal not working properly

Summaya pro asked 6 years ago

Hi, I am using mdb-select inside modal but drop down box css is breaking and not showing as it supposed to be. Kindly help.

Damian Gemza staff commented 6 years ago

Dear Summaya, Could you please check if your problem exists in the latest version of MDB Angular? Problems with z-index in select were resolved few updates ago, in 6.1.2 version exactly. Best Regards, Damian

mr.Jelle-Beat commented 6 years ago

@Damian Gemza, I have this same issue in ng-uikit-pro-standard-6.1.4 A expanded select will disappear behind the footer of a modal, even in the most basic setup.

mr.Jelle-Beat answered 6 years ago

For the ones still messing around with this issue, the following css corrects the select laying underneath the modal: 
:host /deep/ mdb-select-dropdown {
  position: fixed;
  width: 380px; //This is dependent on the modal you're using

  .dropdown-content {
    top: 0 !important;
    left: 0 !important;
  }
}
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

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

Resolved

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
Summaya
Pro User
0Support score
2Questions 0Answers
0Snippets likes 0Snippets