title: Buttons won't align properly in Firefox
body: <p>Rails 4, Ruby 2, Bootstrap 3, DataTables 1.10</p>
  
  <p>Buttons for pagination align properly in IE and Chrome.  They won't align in Firefox.  I tried using this patch <a href="http://css-tricks.com/forums/topic/button-padding-issue/" rel="nofollow noreferrer">for Firefox</a>.  I tried using input-group/input-group-btn.  This code is generated by DataTables.</p>
  
  <p>In Firebug, the funky block in the upper right corner of First refers to ALL the li elements in the HTML in reverse order.  Leftmost is "last", then "next", then "previous, then "first".</p>
  
  <p>Firefox:</p>
  
  <p><img src="https://i.stack.imgur.com/3wjQu.gif" alt="Firefox buttons"></p>
  
  <p>Chrome and IE:</p>
  
  <p><img src="https://i.stack.imgur.com/ruzEm.gif" alt="Chrome and IE buttons"></p>
  
  <p>HTML generated by DataTables for Bootstrap:</p>
  
  <pre><code>&lt;div class="col-xs-6" style="outline: medium none;"&gt;
      &lt;div class="dataTables_paginate fg-buttonset ui-buttonset fg-buttonset-multi ui-buttonset-multi paging_full" id="adminitemstable_paginate" style="outline: medium none;"&gt;
          &lt;ul class="pagination" style="outline: medium none;"&gt;
              &lt;li class="fg-button ui-button ui-state-default first disabled" aria-controls="adminitemstable" tabindex="0" id="adminitemstable_first" style="outline: medium none;"&gt;
                  &lt;a href="#" style="outline: medium none;"&gt;
                      First
                  &lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="fg-button ui-button ui-state-default previous disabled" aria-controls="adminitemstable" tabindex="0" id="adminitemstable_previous" style="outline: medium none;"&gt;
                  &lt;a href="#" style="outline: medium none;"&gt;
                      Previous
                  &lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="fg-button ui-button ui-state-default next" aria-controls="adminitemstable" tabindex="0" id="adminitemstable_next" style="outline: medium none;"&gt;
                  &lt;a href="#" style="outline: medium none;"&gt;
                      Next
                  &lt;/a&gt;
              &lt;/li&gt;
              &lt;li class="fg-button ui-button ui-state-default last" aria-controls="adminitemstable" tabindex="0" id="adminitemstable_last" style="outline: medium none;"&gt;
                  &lt;a href="#" style="outline: medium none;"&gt;
                      Last
                  &lt;/a&gt;
              &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>