From 812b99263f08d2306219ed6fcbe1685be17d6a10 Mon Sep 17 00:00:00 2001 From: pickypg <pickypg@gmail.com> Date: Fri, 15 Mar 2013 02:54:24 -0300 Subject: [PATCH] Fix dropdown (and therefore typeahead) wrap MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit I have recently been experimenting with a lot of Typeahead controls, and I ran into a situation where my Typeahead was too wide for my screen, particularly on mobile devices, and it was not wrapping as I had expected it to do. http://jsfiddle.net/Mtxkn/3/ Changing the CSS for `.dropdown-menu > li > a` to `white-space: normal` causes it to wrap in every scenario that I have seen, whereas leaving it as `nowrap` never does what I want when the text is too long for a given row. It's possible that this has ramifications for other dropdown menus, but honestly I expect that even those would prefer to wrap than to extend the screen horizontally. Â If that is not the case, then it would work to change the typeahead version of this only: ```css .typeahead > li > a { Â Â white-space: normal; } ``` --- less/dropdowns.less | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/less/dropdowns.less b/less/dropdowns.less index bbfe3fd3e3..e30144527a 100644 --- a/less/dropdowns.less +++ b/less/dropdowns.less @@ -79,7 +79,7 @@ font-weight: normal; line-height: @baseLineHeight; color: @dropdownLinkColor; - white-space: nowrap; + white-space: normal; } } -- GitLab