twitter/bootstrap — pull request #783 by jasny (2011-12-10 16:25:57+00:00)
Title: Alternative tabbable implementation

I like to suggest this alternative solution for tabbable / vertical tabs for version 2.0. It's based on the vertical tabs implementation I'd written for 1.4 and not based on the tabbable currently in 2.0. (Loving what you're doing with 2.0 by the way :D)

I've rewritten my version, so the HTML syntax it almost the same as the current implementation. I also tried to make to use existing classes as much as possible instead of introducing new ones and in general make tabbable follow the bootstrap logic.

Please have a look at http://jasny.github.com/bootstrap/components.html#navigation

This implementation got some advantages:

- Placing tabs in a tabbable doesn't border it by default, giving you the ability to place the tabs above, below, left of right with the current look for tabs.
- You can optionally put a border around the tabs using .bordered-tabbable
- The borders of a .bordered-tabbable are rounded.
- Vertical tabs (without borders) always look good, no-mater if the content is smaller than the tabs. (A bordered vertical tabbable with little content still looks strange.)
- There is no need to specify .above, .below in .tabbable. Putting the tabs below the content will automatically change the orientation of the tabs.
- Instead of putting .left and .right in .tabbable, you may use .pull-left and .pull-right on .tabs.
- If the text is to long for vertical tabs, it will wrap nicely.
- You may resize vertical tabs using the known .spanX syntax on .

I also added support for .succes and .danger on tabs. You can often see this in interfaces (eg phpMyAdmin, Lighthouse app).

Please let me know your thoughts about this. Thanks in advance :)