z-index being improperly set

I’m using bootstrap-datepicker in a project where it sits next to another widget.

In Safari, the z-index is being manually set to 10. However, the widget that it sits next to is set to 999. So whenever the date picker drop down is displayed, it shows up UNDER the widget next to it.

In Firefox, the z-index is not set, so this behavior is not apparent.

Solution: you are already attaching a .datepicker-dropdown class to the drop down. Simply let us developers customize that class with our own z-index value so that we can make sure it is properly positioned on our pages.

Don’t manually set it in code.

[rosskevin]

I have a situation where a sibling element (not parent) is absolutely positioned. In this rare case, hardcoding the z-index with !important works i.e.

.datepicker-dropdown {
  z-index: 1036 !important;
}

[Azaret]

Tried on the last version and it looks fine.