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;
}
```
Buttons that are disabled are still clickable and can still fire click events (such as hopping up to the top of the page if your anchor href points to "#"). Adding the pointer-events:none property will truly disable the button so situations like this don't happen.
* Change .brand to .navbar-brand
* Change .btn-navbar to .navbar-toggle
* Redesign navbar toggle to be a bit lighter and wider
* Center align the navbar brand with a max-width of 200px (to minimize hit area) while still centering
* They're hidden by default in the mobile-first views because otherwise they just cover up the slides
* In mobile they're centered, and then are shown left aligned at larger viewports
* Drop custom type arrow controls for glyphicons icons instead for more consistent rendering
* Remove the captions and instead let folks implement what they want in the carousel
* Move the indicators to the bottom middle instead of top right
* Lighten up gradients on the edges for less harsh lighting
* Removes text-align from td elements (no need to set that one)
* Specifically sets th to text-align: left; at a global level (no longer within .table) to override browser defaults
* Removes font-weight: bold; from th while we're at it since that's browser default already
