Limiting the Size of a Select Box

[iamt_ps]

Hello,

I have the problem, that the select box is cut off by the screen edge when it is expanded. Therefore I wanted to ask, if there is a way to limit the size of the expansion so that it does not keep getting cut off by the edge of the Screen. I attached a screenshot of the select box. The project is created using pixels for positioning. The white background is sized to show the actual screen area and the grey background shows the area that is out of screen on the target device. I have tried to run the project on the target device with the screen size of 1366x768px but the select box is still cut off and the last items are not reachable on the target device. 

 

[webiq-sk · Accepted solution]

Hello, as it's a web HMI you can solve these issues with CSS - this is the correct selector:

.iq-select-box .iq-anchor {
    max-height: 296px;
}

Please note that this will change the height of all select box option dropdowns so you might want to customize that by using a custom class.

[iamt_ps]

It worked thank you very much for the quick support!

[HmiGuide]

You can also open the list upwards. Unfortunately, this does not currently work automatically depending on the position, but can be set manually using the CSS modifier "list-on-top". Maybe this is helpful, too.