title: Make Twitter Bootstrap Table's right most column flush against the edge
body: <p>I'm using Twitter-Bootstrap (3.0) to design a project website for school, we're making an online Risk clone, with independant turns like Words With Friends.  I use an HTML table to displays the player's list of current games and I would like to make it so the right-most column is flush against the edge and doesn't have a lot of extra white space. </p>
  
  <p>Here is my dummy table:</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;table class = "table table-hover"&gt;
      &lt;thead&gt;
          &lt;tr&gt;
              &lt;th&gt; Game ID &lt;/th&gt;
              &lt;th&gt; Status &lt;/th&gt;
              &lt;th&gt; Players &lt;/th&gt;
              &lt;th&gt; Turn &lt;/th&gt;
              &lt;th&gt; Last Turn &lt;/th&gt;
         &lt;/tr&gt;
     &lt;/thead&gt;
     &lt;tbody&gt;
         &lt;tr&gt;
             &lt;td&gt; 1 &lt;/td&gt;
             &lt;td&gt; IN PROGRESS &lt;/td&gt;
             &lt;td&gt; 4/4 &lt;/td&gt;
             &lt;td&gt; tedbeem &lt;/td&gt;
             &lt;td&gt; 11/12/13 6:30 PM &lt;/td&gt;
             &lt;td&gt; &lt;button class = "btn btn-primary"&gt; View &lt;/button&gt; &lt;/td&gt;
         &lt;/tr&gt;
         &lt;tr&gt;
             &lt;td&gt; 2 &lt;/td&gt;
             &lt;td&gt; RECRUITING &lt;/td&gt;
             &lt;td&gt; 4/5 &lt;/td&gt;
             &lt;td&gt; N/A &lt;/td&gt;
             &lt;td&gt; 11/12/13 3:10 PM &lt;/td&gt;
             &lt;td&gt; &lt;button class = "btn btn-primary"&gt; View &lt;/button&gt; &lt;/td&gt;
         &lt;/tr&gt;
         &lt;tr&gt;
             &lt;td&gt; 13 &lt;/td&gt;
             &lt;td&gt; IN PROGRESS &lt;/td&gt;
             &lt;td&gt; 3/3 &lt;/td&gt;
             &lt;td&gt; D-Halt-on &lt;/td&gt;
             &lt;td&gt; 11/12/13 9:00 AM &lt;/td&gt;
             &lt;td&gt; &lt;button class = "btn btn-primary"&gt; View &lt;/button&gt; &lt;/td&gt;
         &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>
  
  <p>An example of what I want it to look like can be found here: <a href="http://bootsnipp.com/snippets/featured/table-with-users" rel="nofollow">http://bootsnipp.com/snippets/featured/table-with-users</a></p>
  
  <p>What they did is give the last element a fixed width and somehow it works.  Can someone explain this or give my a better solution?</p>