title: HTML Bootstrap table title (caption) with title on left side and buttons on right side
body: <p>I want to build a table with a title bar. The title bar has to have the title on the left side and some buttons (that I´ll add Javascript support) on right side. I´m not succeeding. </p>
  
  <p><a href="http://jsfiddle.net/cox123456a/s8tDA/" rel="nofollow">JS Fiddle link</a></p>
  
  <p>Code:</p>
  
  <pre><code>&lt;div class="table-responsive small"&gt;
      &lt;table class="table table-striped table-bordered table-hover table-condensed"&gt;
          &lt;caption style="border: inherit; background-color: lightgrey;"&gt;
              &lt;span class="align-left"&gt;&lt;strong&gt;Monthly Savings Report&lt;/strong&gt;&lt;/span&gt;
              &lt;button type="button" id="printBtn" class="btn btn-default btn-sm" title="Print"&gt;
                  &lt;span class="glyphicon glyphicon-print"&gt;&lt;/span&gt;
              &lt;/button&gt;
          &lt;/caption&gt;
          &lt;tr&gt;
              &lt;th&gt;Month&lt;/th&gt;
              &lt;th&gt;Savings&lt;/th&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;January&lt;/td&gt;
              &lt;td&gt;$100&lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td&gt;February&lt;/td&gt;
              &lt;td&gt;$50&lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Questions:</p>
  
  <p>a) How Can I align the title text 'Monthly Savings Report' to left and the Print button to right ?</p>
  
  <p>b) Is there a way to style it better (using Bootstrap default style classes instead of <code>style="border: inherit; background-color: lightgrey;"</code>?</p>