css - 使 select2 多选不换行到多行

Question

有没有办法让多选在选择足够多的值时不换行？例如，这是它的作用:

我想要的是将它全部包含在一行中并且只能水平访问。 Select2 提供箭头键导航以及删除键用法，所以这不是什么大问题。

我想这可能可以用 CSS 来完成，但我正在努力弄清楚需要做什么。

Answer 1

一种方法是:

fiddle :http://jsfiddle.net/EHzcc/735/

CSS:

.select2-choices{
    display:-webkit-inline-box;
}

更新:

.select2-choices{
    display:-webkit-inline-box;
    max-width: 250px;   //  <--- set the max width you want
    //width: 250px;              or just force the width
}

更新 N :玩方向也许: http://jsfiddle.net/wEqLt/

---

最新版本更新: fiddle :http://jsfiddle.net/EHzcc/735/

CSS:

.select2-selection__choice{
    float: none !important;
    display: inline-block !important;
}

---

4.1 版更新: fiddle :http://jsfiddle.net/srg2deo5/

CSS:

.select2-selection{
  overflow-y:auto;
  white-space:nowrap;
}

ul.select2-selection__rendered{  
    white-space: nowrap;
}