Tabs - Responsywnie

Witajcie, dopiero zaczynam naukę tego frameworka, więc moje myślenie może być błędne. Chce zrobić responsywną tabelkę ze zmieniającą się treścią w zależności od klikniętego przycisku, dla przykładu załączę obrazek.

Przykład znalazłem tutaj:
http://cdn.tutsplus.com/webdesign/uploads/legacy/tuts/319_bootstrap_pills_tabs/Tabs-Pills-BEGIN/tabs-pills.html
ale nie do końca jest tak jakbym chciał.
Moje cele są takie:
Tekst w buttonach w zależności od rozdzielczości ma się kurczyć, zawijać w obrębie butonów i tak samo z treścią dla określonego butona (w podanym przeze mnie przykładzie jeżeli tekst buttonu jest długi to się nie zawija. W kilku przykładach widziałem, że jeżeli zwężę okno przeglądarki odpowiednio to część odpowiedzialna za treść spada pod część przycisków, chciałbym uniknąć takiego efektu chociaż nie wiem czy będzie to dobry pomysł.

Proszę o radę i ewentualne pytania.

Pozdrawiam Łukasz

Bootstrap jest responsywny domyślnie, ale ani to demo, ani Twój layout nie są zrobione "pod responsywkę."

Z przyciskami będzie prosto: Spójrz na to fiddle: http://jsfiddle.net/TTKtb/2/
Z layoutem - http://getbootstrap.com/css/#grid jeśli dobrze widzę przyciski bedziesz mieć w 3 kolumnach a content w 9 w domyślnym roziarze, natomiast dla rozmierów małych, polecałbym przyciski dać na górę jako 12 i content też 12.

OK, tutaj też znalazłem demo które mnie zadowala http://tutsme-webdesign.info/tutorials/navs/pills_stacked_panesright.html tylko zastanawiam się jak zrobić aby box z treścią nie spadał pod część z buttonami po zmianie rozdzielczości.

http://getbootstrap.com/css/#grid-example-mixed

Tłumaczenie: użyj klas .col-xs-* .col-md-* żeby nie spadał Ci panel pod buttony.

Ok, dzięki. Muszę się bardziej zagłębić w dokumentacje.