Twitter Bootstrap todas las pestañas que se muestran en la página carga

Question

Tengo el código de pestañas en funcionamiento pero en la página carga todas las pestañas se muestran ... Una vez que hago clic en la segunda pestaña solo se muestra el contenido de esa segunda pestaña. Hago clic nuevamente en la primera pestaña y solo se muestra el contenido de la primera pestaña. Actualice la página y verá todo el contenido en esta primera pestaña hasta que repita los pasos anteriores. ¿Alguna idea de lo que me estoy perdiendo?

<ul id="tab" class="nav nav-tabs"> 

<li class="active"> 
<a href="#firsttab" data-toggle="tab">firstab</a> 
</li> 
<li class=""> 
<a href="#secondtab" data-toggle="tab">secondtab</a> 
</li> 

</ul> 
<div id="myTabContent" class="tab-content"> 
<div class="tab-pane fade active in" id="firsttab"> 


<p> Content of first tab </p> 

</div> 


<div class="tab-pane fade active in" id="secondtab"> 

<p> Content of second tab </p> 
</div> 
</div> 

Answer 1

Ambas pestañas no se puede tener la clase "activa"