Handsontable height problem on modal window

Getting help Questions
1

Hello, I want to use two handsontables (with about 20px space each other) on one modal window, but the tables are stretching by default.

When I set the height it’s okay, but autocomplete dropdown menu is trimmed.
https://jsfiddle.net/4zwe90un/9/

Thanks

2

Hi @bataak1

I can see that there’s a lot going on it this demo. There are two tables switched by arrow buttons and the window is getting bigger with a click inside of the table.
You would want the window to stay the same in size regardless the size of the table?

3

Yes, also want to use overflowed autocomplete dropdown menu

4

I would give the modal-body class a

overflow: hidden;
height: 220px;

properties but I’m not sure if it will fix your problem.

5

I tried it. And I tested below code:

#maintable>.ht_master.handsontable>.wtHolder { max-height: 80px !important; }

However this would fixed my problem (not completely), when I click autocomplete cell and dropdown menu appear, the vertical scroll bar is mysteriously appeared and disappeared. https://jsfiddle.net/4zwe90un/13/

6

Okay, you fixed my problem. Thank you!

`.modal-body
{
height: 600px;
overflow: hidden;
}

#emaintable>.ht_master.handsontable>.wtHolder,
#maintable>.ht_master.handsontable>.wtHolder
{
max-height: 80px !important;
}
`

7

Great!
Thanks for an update @bataak1