"ms-options" are obscured by the parent div.

[zero12a]

Describe the bug
A clear and concise description of what the bug is.

When parent div position of "Div 'ms-options' " is relative. "Div 'ms-options'" hidden and "Parent div" scrolled vertical.

Field name "IMGTYPE4" of attach file "multiselect.js" is not good.

Another field name "IMGTYPE5" of attach file "select2.js" is good.

To Reproduce
Steps to reproduce the behavior:

1. Go to '...'
2. Click on '....'
3. Scroll down to '....'
4. See error

Expected behavior
A clear and concise description of what you expected to happen.

"Div 'ms-options' " is top of div.

Screenshots
If applicable, add screenshots to help explain your problem.

Desktop (please complete the following information):

• OS: mac 10.15
• Browser : firefox 79.0 and chrome
• Version : multiselect 2.4.18

Smartphone (please complete the following information):

• Device: [e.g. iPhone6]
• OS: [e.g. iOS8.1]
• Browser [e.g. stock browser, safari]
• Version [e.g. 22]

Additional context
Add any other context about the problem here.

[nobleclem]

I don't fully understand the issue you are having. In both cases it looks like the lists are showing correctly to me. However this project doesn't have any files by the name of select2.js. So I don't know what that refers to.

[zero12a]

Dear nobleclem.

Multiselect.js bug example is this link ( https://github.com/zero12a/ds/blob/master/demo_multiselect_bug.html )
Select2.js example is this link ( https://github.com/zero12a/ds/blob/master/demo_select2_bug.html )

Thank regards.

[nobleclem]

So the problem in your example is that the wrapping div with the silver background has a max-height of 200px. The entire multiselect is contained within this div. So you would need to set the maxHeight parameter in the plugin to that of the div minus the height of the <button> (28px by default). Now if the maxHeight is less than 200px then you would need to set the minHeight to this same value as maxHeight cannot be greater than minHeight which has a default value of 200px.

So in your example you would need to do the following:

$('#tSelect').multiselect({
    columns: 1,
    maxWidth : 200,
    minHeight: 170,
    maxHeight: 170
});

Now the other library select2.js that is not maintained by me places its options list at the same level as your div with the max-height: 200px on it. So because of that it is not constrained by the height and can overlap it as it does in your example.