select选择过多的选项就下移，如何解决

Question

问题描述

机构选择过多，会出现下拉框不见，机构出现在选择框外，我这里是固定死了长度的

问题出现的环境背景及自己尝试过哪些方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

<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>

你期待的结果是什么？实际看到的错误信息又是什么？

期待的效果是我的select可以随着选项增长或者多出来的选项鼠标放上去可以浮动显示数据

Answer 1

官方有 demo 示例的，楼主可以看看它是怎样控制的。传送门

Answer 2

你在i-select中给的overflow：hidden，就已经可以把后面出现在选框外的给隐藏了

Answer 3

white-space: nowrap 这句干啥的，这个就不会换行了，所以就往后撑溢出了。