Help with using navbar with ColumnControl

PaulVickery

Please can someone help me with my issue.

I am using columnControl in conjunction with "navbar". The problem that I have is that when I select the dropdown menu, the ColumnControl "div.dtcc-search-type-icon" displays in front of the dropdown menu.
What happens is when I select the dropdown menu and move the mouse pointer down the menu items, the menu is lost if I move the pointer over the ColumnControl icon (highlighted in red in the attachment) and the example below.

Please see the following example: https://live.datatables.net/jififibe/1/edit
In the example I am using:

    columnControl: {
      target: 1,
      content: ['search']
    },

One a separate note, if I use the following instead, the issue does not occur.

columnControl: ['searchDropdown'],

I would be grateful for any help.

allan

Increase the z-index on your .dropdown-content style: https://live.datatables.net/jififibe/2/edit .

This article on MDN might help explain the z-index property if you are interested in digging into it a bit more.

Allan

PaulVickery

Hi Alan, Thank you very much. I am sorry for wasting your time on something so trivial. All working fine.

allan

One of those things - easy when you know, but if you don't it absolutely isn't! No such thing as a silly question .

Allan