Topic: angular datepicker behind tabs

riccy pro asked 7 years ago

datepicker as you can see, the top of the datepicker is behind the tabset. any ideas how to solve this? thank you.

id90travel pro answered 6 years ago

This is still an issue with us too. Please look into it. Changing the z-index of the picker does not matter. The issue is because the picker is a child of the tabs and setting the z-index does not matter because the context of the picker is already below the tabs.



Damian Gemza staff commented 6 years ago

Dear id90travel, Please head into /scss/pro/_tabs.scss and comment line 42 (z-index: 1). This should fix your problem. I will include that solution to next release. Best Regards, Damian

riccy pro answered 6 years ago

The problem still exists.  This thread: made me try to remove the  [contentClass]="'card'" and replace it with [contentClass]="''". Now the datepicker is no more behind the nav tabs. Could you please investigate this behaviour?

Damian Gemza staff commented 6 years ago

Hmmm, that's strange.. We've tested this case, and we haven't got any problems with datepicker. Could you send me your project without any changes with [contentClass] and without node_modules @ ? i'll investigate that. Best Regards, Damian

riccy pro answered 7 years ago

thanks for the suggestion but unfortunately this didn't work.

Rafał Rogulski free commented 7 years ago

Hi, Please send my your project on my email:, I will look whats is wrong. Regards

Rafał Rogulski free answered 7 years ago

Hi, Try to give higher z-index on date picker and it backdrop:
.picker {
  z-index: 9999;


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: Pro
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No