If select chooses too many options, it will move down. How to solve the problem?

problem description

if there are too many choices of the mechanism, the drop-down box will not be seen, the mechanism will appear outside the selection box, and I have a fixed length

.

the environmental background of the problems and what methods you have tried

related codes

/ / Please paste the code text below (do not replace the code with pictures)

<div>
    <span class=""></span>
         <i-select v-model="orgs_name" filterable multiple  @on-change="selectOrgs" style="width: 400px;overflow: hidden; white-space: nowrap" clearable="true">
            <i-option v-for="item in orgsList" :value="item.ORGID" :key="item.ORGID">{{item.ORGID}} - {{ item.ORGNAME}}</i-option>
        </i-select>
 </div>

what result do you expect? What is the error message actually seen?

the expected effect is that my select can float and display data as the options grow or the extra options are placed on the mouse

Sep.30,2021

officially there is an example of demo, and the landlord can see how it is controlled. Portal


the overflow:hidden, you gave in i-select can hide what appears outside the box

.

What does the sentence

white-space: nowrap do, so it doesn't change the line, so it spills back.

Menu