title: How to center content within a div
body: <p>I am trying to center a content that contains a table inside a div... But I cannot seem to work out how to do it...</p>
  
  <p>Basically Id like to put some text next to a table, and center the table and the text to the page...</p>
  
  <p><strong>The content I am trying to center:</strong></p>
  
  <pre><code>        &lt;div style="background: purple; padding: 5px;"&gt;
              &lt;div&gt;
              &lt;table style="float: left;"&gt;
                  &lt;tr&gt;
                      &lt;th&gt;This&lt;/th&gt;
                      &lt;th&gt;is&lt;/th&gt;
                      &lt;th&gt;a&lt;/th&gt;
                      &lt;th&gt;test&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/table&gt;
              &lt;/div&gt;
              &lt;span style="background: yellow; margin-left: 15px; float: left;"&gt;This is a test&lt;/span&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p><strong>What I have tried:</strong></p>
  
  <pre><code>    &lt;div style="background: red; width: 100%; text-align: center"&gt;
          &lt;div style="background: purple; padding: 5px;"&gt;
              &lt;div&gt;
              &lt;table style="float: left;"&gt;
                  &lt;tr&gt;
                      &lt;th&gt;This&lt;/th&gt;
                      &lt;th&gt;is&lt;/th&gt;
                      &lt;th&gt;a&lt;/th&gt;
                      &lt;th&gt;test&lt;/th&gt;
                  &lt;/tr&gt;
              &lt;/table&gt;
              &lt;/div&gt;
              &lt;span style="background: yellow; margin-left: 15px; float: left;"&gt;This is a test&lt;/span&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>If someone would be able to tell me what I am doing wrong here it would be greatly apprectiated.</p>