title: Bootstrap dropdown inside a table doesn't work with .table-responsive
body: <p>Here is the link to the live example.
  <a href="http://www.codeply.com/go/uBnL1bBs6v" rel="nofollow">http://www.codeply.com/go/uBnL1bBs6v</a></p>
  
  <p>From which you can see, the dropdown gets cutoff when I apply a layer <code>&lt;div calss="table-responsive"&gt;&lt;/div&gt;</code>to wrap the table.</p>
  
  <p>If you remove the wrapper <code>&lt;div class="table-responsive"&gt;&lt;/div&gt;</code>, the dropdown works fine.</p>
  
  <p>I was wondering what would be the problem and how do I fix it?
  I added table-responsive class because I need the function to scroll between columns since I have a lot columns.</p>
  
  <p>Any help would be appreciated.</p>