title: Css align to center td with two floating elements
body: <p>I have table that i need all the content to be align center, and in one td i have image with span after the image.
  I need all the images in the tr td to be aligned vertically so i apply float left to them but i loosed the align center. What the solution for this?</p>
  
  <pre><code> &lt;body&gt;
     &lt;table class="table table-striped"&gt;
       &lt;tr&gt;
         &lt;td&gt;
         &lt;img src="http://placehold.it/50x20" alt=""&gt;
         &lt;span&gt;short text&lt;/span&gt;   
         &lt;/td&gt;
         &lt;td&gt;some text&lt;/td&gt;
         &lt;td&gt;some text&lt;/td&gt;
         &lt;td&gt;some text&lt;/td&gt;
       &lt;/tr&gt;
        &lt;tr&gt;
           &lt;td&gt;
         &lt;img src="http://placehold.it/50x20" alt=""&gt;
         &lt;span&gt;longer text text&lt;/span&gt;   
         &lt;/td&gt;
         &lt;td&gt;some text&lt;/td&gt;
         &lt;td&gt;some text&lt;/td&gt;
         &lt;td&gt;some text&lt;/td&gt;
       &lt;/tr&gt;
     &lt;/table&gt;
    &lt;/body&gt;
  
  .table tr td {
    text-align: center;
  }
  .table tr td:first-child span, .table tr td:first-child img  {
   float:left;
  }
  
  .table tr td:first-child img   {
    margin-right: 5px;
  }
  </code></pre>
  
  <p>plunker: 
  <a href="http://plnkr.co/edit/D4VbnesF3FnwnNHI25nB?p=preview" rel="nofollow">http://plnkr.co/edit/D4VbnesF3FnwnNHI25nB?p=preview</a></p>
  
  <p>I need the images to be Aligned with all the other images, also the span.</p>