Dropdown-menu with fixed header

Cassio Seffrin

Hi guys,

I wonder if is possible to create a dropdown-menu in table with fixed header.
I have a sample that works without scrollY. When I set the parameter "scrollY": "300px", the dropdown menu become hidden behind div dataTables_scrollBody. I tryied to change the position of the header div to relative and the z-index of dropdown-menu, but no success.

https://jsfiddle.net/8u8Lkyd5/2/

Please forgive-me if this issue was in another thread.

Best Regards,
Cássio

PaulFreeWebs

here try this, i fixed the drop down https://jsfiddle.net/8u8Lkyd5/8/

Cassio Seffrin

I appreciate your help @PaulFreeWebs, however I have solve what a want by using this style. With that approach last Css the dropdown-menu overlay the content of the table.

.dropdown-menu {
overflow: overlay !important;
overflow-x: overlay !important;
overflow-y: overlay !important;
}
.dataTables_scrollHead {
position: relative;
width: 100%;
overflow: initial !important;
overflow-x: initial !important;
overflow-y: initial !important;
min-height: 0
}

The current sample is here:
https://jsfiddle.net/8u8Lkyd5/13/

Best Regard,
Cássio Seffrin

PaulFreeWebs

@Cassio Seffrin no problem, glad its resolved now