Ustawianie wieloseleksera Wysokość wybranego pola

Question

Używam opcji Wybrane z menu rozwijanym z wieloma opcjami i chcę ustawić wysokość wybranego pola na ustawiony rozmiar.

Mam wybrane pole w oknie dialogowym z przepełnieniem: ukryte, a wybrane pole znajduje się całkowicie poza kontenerem (tak, że wybrane menu wychodzi poprawnie z okna dialogowego). Niestety, "position: absolute;" usuwa go z przepływu i nie powoduje wysokości ... powoduje skurczenie okna dialogowego i pojawia się opcja wielokrotnego wyboru. Mogę ustawić kontener nadrzędny na stałą wysokość, ale wybór wielokrotny rozszerza się, gdy wybieranych jest więcej opcji, i nadal będę napotykał ten sam problem na długich listach.

Czy istnieje sposób ustawienia wybranego wyboru wielokrotnego na określoną wysokość? Dzięki!

Answer 1

Nevermind ... zdobione go na własną rękę za pomocą CSS:

.mycontainer { 
    height: 120px; 
} 

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

.mycontainer jest div, które posiada wybraną rozwijanej.

---

Proszę rzucić edycji odpowiedź. Ta odpowiedź jest zgodna z wersją Wybranych, która była dostępna 2 lata temu, kiedy pierwotnie zadałem pytanie. Dla osób, które używają nowszych wersji (np. 1.4.2), możesz spróbować zmienić prefiks "chzn" w powyższym CSS na "wybrany" ... ale nie ma gwarancji, że to zadziała (nie patrzyłem na ich nowe . stylizacji)

Answer 2

udało mi się rozwiązać wysokość listy w poniższej klasy css:

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

i mam zwój dla pozostałych listę.

Answer 3

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

Answer 4

Wszystkie inne odpowiedzi pracować, ale wierzę, że jest to najbardziej eleganckie rozwiązanie: Ustaw nową maksymalną wysokość dla .chzn-results (np 150px). Wszystkie odpowiednie pozostałe bloki będą podążać. W ten sposób rozwijanie nie będzie zbyt duże, z tylko kilkoma wynikami.

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

Jeśli naprawdę chcesz stałej wysokości, nawet z kilku wyników, wystarczy użyć następującego kodu:

.chzn-results { 
    height: 150px; 
} 

(Dodaj !important do linii, jeśli trzeba zastąpić zachowanie chosen.css „s)

Answer 5

to co załatwiło sprawę dla mnie:

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

Y w zasadzie chcesz ograniczyć wysokość ul, która zawiera opcje.