Bootstrap pills non funzionano

[Alhazred]

Sto uscendo pazzo, questo è il codice

<ul class="nav nav-pills">
    <li class="active"><a href="#home" data-toggle="pill">Uno</a></li>
    <li><a href="#uno" data-toggle="pill">Due</a></li>
    <li><a href="#due" data-toggle="pill">Tre</a></li>
    <li><a href="#tre" data-toggle="pill">Quattro</a></li>
</ul>
<div class="pill-content">
    <div class="pill-pane active" id="home"><h1>Home</h1></div>
    <div class="pill-pane"  id="uno"><h1>Uno</h1></div>
    <div class="pill-pane"  id="due"><h1>Due</h1></div>
    <div class="pill-pane"  id="tre"><h1>Tre</h1></div>
</div>

Vengono mostrati tutti i div "pill-pane" contemporaneamente, invece mi aspetterei che si vedesse solo il primo, con classe active, e gli altri venissero nascosti e mostrati solo a seguito del click sul link associato.

Penso di aver importato tutto ciò che serve, js e css, visto che se converto il codice sopra da pills a tabs, le tab funzionano correttamente, mosta solo il contenuto del div active e gli altri no, vengono mostrati solo cliccando la tab relativa.

Perché le tab mi funzionano e i pill no?

[Alhazred]

Ok, capito il problema.
I link devono avere data-toggle="tab" e i div classe "tab-content" e "tab-pane".
O almeno così funziona.

[m4rko80]

Ciao, partendo da questo esempio e sostituendo solo la classe "nav nav-tabs" con "nav nav-pills" pare funzioni correttamente.
Forse non è ben spiegato nella documentazione da quanto ho visto. Pare non sia necessario sostituire tutte le classi da "-tab" a "-pill".

EDIT
Ho postato dopo la tua risposta...