I have tabs, where I put a dropdown element inside. The problem is, the dropdown list is not visible. Open/close event is working, but I don't see the list. If i move the dropdown outside the tabs, it is working. What's going on ?

JavaScript

<!-- language: lang-js -->

$(document).ready(function () {
    $('.tabs-student a').click(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });
});

HTML

<!-- language: lang-html -->

<ul class="nav nav-tabs tabs-s">
  <li class="active"><a href="#tab-activity">A</a></li>
  <li class=""><a href="#tab-sales">B</a></li>
</ul>
<div class="tab-content">
  <div class="tab-pane active" id="tab-activity">
      <div class="btn-group left">
          <button class="btn btn-small dropdown-toggle" data-toggle="dropdown">test1
              <span class="caret caret-fix"></span>
           </button>
           <ul class="dropdown-menu class-list scrollable-menu center">
              <li><label id="1" class="link active">test1</label></li>
              <li><label id="2" class="link">test2</label></li>
           </ul>
       </div>
  </div>
  <div class="tab-pane" id="tab-sales">
     test
  </div>
</div>

It should work without overriding the overflow property of .tab content. The only other thing I noticed is that you're initializing tabs for the class tabs-student, but that class doesn't exist in your markup. I think that's probably what you intended in the ul element with .tabs-s. When I changed that, everything works just fine.

See this jsFiddle

This JavaScript:

<!-- language: lang-js -->

$('.tabs-student a').click(function (e) {
    e.preventDefault();
    $(this).tab('show');
});

Should correspond to this HTML:

<!-- language: lang-html -->

<ul class="nav nav-tabs tabs-student">
  <li class="active"><a href="#tab-activity">Activity</a></li>
  <li class=""><a href="#tab-sales">Sales</a></li>
</ul>

Should look like this: