複数選択の選択ボックスの高さを設定する

Question

私は選択した複数のドロップダウンで選択を使用しており、選択したボックスの高さを設定サイズに設定します。

オーバーフロー：非表示のダイアログボックスで選択したボックスがあり、選択したボックスがコンテナの外側に絶対配置されているため（選択したドロップダウンがダイアログから正しくポップされます）残念ながら、 "position：absolute;それをフローから削除し、高さをもたらしません...ダイアログを縮小し、マルチ選択をポップするように見せます。親コンテナを固定高さに設定することはできますが、より多くのオプションが選択されるとマルチ選択が展開され、長いリストでも同じ問題が発生します。

選択したマルチセレクトを特定の高さに設定する方法はありますか？ありがとう！

Answer 1

ネヴァーマインドは... CSSを使って自分でそれを考え出した：

.mycontainer { 
    height: 120px; 
} 

.mycontainer .chzn-container-multi .chzn-choices { 
    height: 120px !important; 
    overflow-y: auto; 
} 

.mycontainerが選ばれたドロップダウンを保持しているdiv要素です。

---

回答の編集をやめてください。この回答は、私が最初に質問した2年前に利用可能だったChosenのバージョンに沿っています。新しいバージョン（つまり1.4.2）を使用している人には、上記のCSSの "chzn"プレフィックスを "selected"に変更してみてください...しかし、これは動作しません（私は新しい。スタイリング）

Answer 2

は、私は以下のCSSクラスのリストの高さを解決することができました：

.chzn-container .chzn-results { 
height: 150px;} 

と私は、リストの残りのためのスクロールを得ました。

Answer 3

.chzn-container .chzn-results { max-height: 150px; } 

Answer 4

他の回答のすべてが動作しますが、私はこれが最もエレガントな解決策であると考えている：.chzn-results（例えば150px）のための新しい最大の高さを設定します。関連する他のすべてのブロックが続きます。この方法でドロップダウンはあまりにも大きくなりすぎず、わずかな結果しか得られません。

.chzn-results { 
    max-height: 150px; 
} 

あなたが本当にしても、いくつかの結果で、一定の高さが必要な場合は、単純に次のコードを使用し

.chzn-results { 
    height: 150px; 
} 

を（あなたがchosen.cssの動作をオーバーライドする必要がある場合に整列する!importantを追加）

Answer 5

これは私のためのトリックをやったことです：

.mycontainer .chosen-choices { 
    max-height: 150px; 
    overflow-y: auto; 
} 

Y基本的にオプションを保持するulの高さを制限したい。