Jak mogę zbudować <select> z opcjami wielowierszowymi?

Potrzebuję zbudować kontrolę wyboru w wielu liniach. Wszystkie numery <option>, gdzie tekst jest szerszy niż 300px (na przykład), muszą mieć niezbędne wiersze, aby nie przekroczyć wspomnianego limitu.Jak mogę zbudować <select> z opcjami wielowierszowymi?

Te zdjęcia mówią same za siebie:

Przede wszystkim starałem, ale nie działa.

<html> 
    <head> 
     <style> 
      option{ 
       width: 100px; 
       white-space: wrap; 
      } 

     </style> 
    </head> 
    <body> 
     <select> 
      <option>I'm short</option> 
      <option>I'm medium text</option> 
      <option>I'm a very very very very very very very very very long text</option> 
     </select> 
    </body> 
</html>

Używam frameworka bootstrap i pomyślałem, że może mógłbym użyć kontrolki rozwijanej do uzyskania wyniku. Próbowałem ustawić właściwość CSS o maksymalnej szerokości, ale to nie działa zbyt ...

Jak mogę to osiągnąć?

Źródło

2013-03-12 harrison4

Jakie jest pytanie? –

Nie można zawijać w słowach wybierz opcje: http://stackoverflow.com/questions/3587942/word-wrap-options-in-a-select-list. i cały Internet? jak żartobliwie. – PlantTheIdea

https://github.com/fnagel/jquery-ui/wiki/Selectmenu

myślę, że to może pomóc, nigdy nie używane przed :)

Źródło

2013-03-12 17:57:47 user666

działa idealnie! Naprawdę dzięki! – harrison4

Nie ma problemu Korekta: nigdy wcześniej nie korzystałem z niej w sposób, który był ci potrzebny, ale jest to dobra wtyczka;) – user666

<option> Znaczniki mają ograniczone możliwości stylizacji i nie obsługują formatowania. Można użyć numeru JavaScript-based alternative. Jeśli się rozejrzycie, jest ich wiele.

Źródło

2013-03-12 17:54:42

Dodawanie, co styl można zrobić jest również niekonsekwentny i specyficzne dla przeglądarki. –

znalazłem dwa linki, które wyjaśnia, dlaczego nie można zrobić, że (i możliwe obejścia):

first link.

second link.

Mam nadzieję, że to pomoże.

Źródło

2013-03-12 18:03:22 n3k0

Zrobiłoby to niezły komentarz, ale nie jest to świetna odpowiedź z powodu braku szczegółów. Graniczy z tym, że jest "linkową odpowiedzią" – SeldomNeedy

Jak mogę zbudować <select> z opcjami wielowierszowymi?

Odpowiedz

Powiązane problemy