I've noticed that the style nav-tabs left isn't functioning in Bootstrap versions 3.3.0 and 3.3.2. I'm curious if anyone has found a way to re-enable this style so that tabs can run vertically with content displayed on the right.
For those interested, here's a working example using Bootstrap 2.3.2:
http://jsbin.com/vimekuloqo/4/edit
And here's a link to the not working example for version 3.3.0:
http://jsbin.com/wituxucuja/1/edit
You can find the relevant code snippet directly from http://getbootstrap.com/2.3.2/components.html#navs.
<ul class="nav nav-tabs">
<li class="active"><a href="#lA" data-toggle="tab">Section 1</a></li>
<li class=""><a href="#lB" data-toggle="tab">Section 2</a></li>
<li class=""><a href="#lC" data-toggle="tab">Section 3</a></li>
</ul>
<div class="tab-content">
<div class="tab-pane active" id="lA">
<p>I'm in Section A.</p>
</div>
<div class="tab-pane" id="lB">
<p>Howdy, I'm in Section B.</p>
</div>
<div class="tab-pane" id="lC">
<p>What up girl, this is Section C.</p>
</div>
</div>
</div>
...
<script language=javascript>
$('#myTab a').click(function (e) {
if($(this).parent('li').hasClass('active')){
$( $(this).attr('href') ).hide();
}
else {
e.preventDefault();
$(this).tab('show');
}
});
</script>