title: Bootstrap CSS table row height with dropdown button too large
body: <p>I have a Bootstrap table where the rows are too high when I use button dropdowns.  Is there some CSS I can use to stop this happening ?  </p>
  
  <p>I've noticed that Bootstrap's tables with normal buttons are not 100% perfect: <a href="http://twitter.github.com/bootstrap/base-css.html#tables" rel="nofollow">http://twitter.github.com/bootstrap/base-css.html#tables</a> but they're better than what's happening with my dropdown buttons.</p>
  
  <p>Here's a Fiddle: <a href="http://jsfiddle.net/uEMtf/" rel="nofollow">http://jsfiddle.net/uEMtf/</a></p>
  
  <p>Here's the HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;title&gt;Test Page&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
   &lt;table class="table table-bordered table-striped"&gt;
      &lt;tbody&gt;
          &lt;tr&gt;&lt;td&gt;some stuff&lt;/td&gt;&lt;td&gt;some more stuff&lt;/td&gt;&lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;here's something&lt;/td&gt;
              &lt;td&gt;&lt;div class="btn-toolbar"&gt;&lt;div class="btn-group"&gt; &lt;button class="btn dropdown-toggle" data-toggle="dropdown"&gt;Options&lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
                          &lt;ul class="dropdown-menu"&gt; &lt;li&gt;&lt;a href="del"&gt; Action 1&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="details"&gt; Action 2&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="edit"&gt; Action 2&lt;/a&gt;&lt;/li&gt;&lt;/ul&gt;&lt;/div&gt;&lt;/div&gt;
                          &lt;/ul&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;tr&gt;
              &lt;td&gt;here's something&lt;/td&gt;
              &lt;td&gt;&lt;button class="btn" href="#"&gt;Default&lt;/button&gt;&lt;/td&gt;
                      &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;another row&lt;/td&gt;
              &lt;td&gt;with more stuff&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  &lt;script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="bootstrap.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;​
  </code></pre>