Created by: jasny
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.tabs
.
Please let me know your thoughts about this. Thanks in advance :)