[boostrap] Tabs - Responsywnie Opcje

[Lejto]

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/...tabs-pills.html Stacked Tabs
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

Ten post edytował Lejto 20.07.2014, 13:52:19

[Bartek91]

Żeby tekst w buttonach się zawijał musisz dodać w css:
white-space: normal;

Co do spadania treści pod przyciski to chyba lepiej tak zostawić, bo w małej rozdzielczości, na przykład na telefonie nie będzie to w ogóle czytelne.

[Lejto]

Ok, dzięki za odpowiedź. W sumie masz rację, może być nieczytelne, ale jeżeli musiałbym tak kiedyś zrobić to jak to zrobić?

Dopiero teraz miałem czas wrócić do tego tematu. Niestety dodanie w CSS white-space: normal; nie załatwiło sprawy.

Edit: ok, poradziłem sobie z tym: http://jsfiddle.net/TTKtb/2/

Ten post edytował Lejto 25.09.2014, 17:47:53