title: Table padding not working in chrome
body: <p>I've been struggling with this table for the past few days and finally got it how I want it only to discover that the text alignment is not working correctly in chrome. It displays exactly how I want it in ie and firefox (vertically aligned to the middle and padded left) However it isn't coming through in chrome. Any help would be amazing, I'm at my whits end.</p>
  
  <p>Opening up these two in jfiddle (<a href="http://jsfiddle.net/kaRev/" rel="nofollow noreferrer">http://jsfiddle.net/kaRev/</a>). The next image illustrates the problem I am having between the two browsers (chrome and ff). Firefox on the right pads it correctly, while chrome on the left does not</p>
  
  <p><img src="https://i.stack.imgur.com/Jx8kD.png" alt="enter image description here"></p>
  
  <p>Here is a screen shot of chrome where the text in the table is too far left. </p>
  
  <p><img src="https://i.stack.imgur.com/8EHc3.png" alt="enter image description here"></p>
  
  <p>And here is firefox which is how I want it:</p>
  
  <p><img src="https://i.stack.imgur.com/0mjkG.png" alt="enter image description here"></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;table class="tableBenefits"&gt;
  &lt;thead&gt;
  &lt;tr&gt;
            &lt;th style="height:34px;width: 207px;font-weight:bold;color:#D2161C;" class="headneed"&gt;
        &amp;nbsp Your Need        &lt;/th&gt;
            &lt;th style="height:34px;width: 166px;font-weight:bold;color:#D2161C;" class="headfeature"&gt;
        Feature        &lt;/th&gt;
            &lt;th style="height:34px;width: 260px;font-weight:bold;color:#D2161C;" class="headbenefits"&gt;
        Benefits   &lt;/th&gt;
  
        &lt;/tr&gt;
  &lt;/thead&gt;
  
  &lt;tbody &gt;
        &lt;tr class="row-mid"&gt;
                &lt;td class="need"&gt;
          Notify technicians &amp;amp; managers of work order status updates          &lt;/td&gt;
                &lt;td class="feature"&gt;
          Automated work order email notifications          &lt;/td&gt;
                &lt;td class="benefits"&gt;
          Keeps team updated on work order status; reduces admin time on work orders          &lt;/td&gt;
  
  
  
            &lt;/tr&gt;
  
    &lt;tr class="row-mid"&gt;
                &lt;td class="need"&gt;
          Notify service/repair requesters of progress          &lt;/td&gt;
                &lt;td class="feature"&gt;
          Automated service request email notifications          &lt;/td&gt;
                &lt;td class="benefits"&gt;
          Keeps requesters updated on progress; reduces personnel time for providing updates          &lt;/td&gt;
            &lt;/tr&gt;
  
    &lt;tr class="row-mid"&gt;
                &lt;td class="need"&gt;
          Manage &amp;amp; track work orders          &lt;/td&gt;
                &lt;td class="feature"&gt;
          Work Order Forms, Linking, &amp;amp; Routing          &lt;/td&gt;
                &lt;td class="benefits"&gt;
          Simplifies work order administration &amp;amp; reduces data entry time          &lt;/td&gt;
            &lt;/tr&gt;
  
    &lt;tr class="row-mid"&gt;
                &lt;td class="need"&gt;
          Manage service &amp;amp; repair requests          &lt;/td&gt;
                &lt;td class="feature"&gt;
          Web-based Service Request Form          &lt;/td&gt;
                &lt;td class="benefits"&gt;
          Simplifies request submission and routing          &lt;/td&gt;
            &lt;/tr&gt;
    &lt;/tbody&gt;
  </code></pre>
  
  <p></p>
  
  <p>CSS:</p>
  
  <pre><code>.tableBenefits thead {
  background: url(http://www.mpulsesoftware.com/sites/all/themes/zen/image/top_eq.jpg) no-repeat;
  }
  
  .tableBenefits {
  border-collapse: collapse;
  border-spacing: 0;
  }
  
  .tableBeneits thead th {
  font-weight:bold;color:#D2161C;
  }
  
  .tableBenefits {height:300px;width:640px;}
  
  .headneed{font-weight:bold;font-size:11px;}
  .headfeature{font-size:11px;}
  .headbenefits{font-size:11px;}
  .need{font-weight:bold;font-size:11px;text-align: left;padding-left: 10px;}
  .feature{font-size:11px;text-align: left;padding-left: 10px;}
  .benefits{font-size:11px;text-align: left;padding-left: 10px;}
  .row-mid{background: url("http://www.mpulsesoftware.com/sites/all/themes/zen/image/middle_eq.jpg")repeat-y;width:640px;border-bottom:1px solid #ccc;}
  
  .row-last{background: url("http://www.mpulsesoftware.com/sites/all/themes/zen/image/bottom_eq.jpg")repeat-y;width:640px;}
  
  
  
  /* Webtk hack*/
  
  @media screen and (-webkit-min-device-pixel-ratio:0) {
  
  
  
  
  .tableBenefits td, .tableBenefits th {
    display: inline-table;
  
  }
  
  .headneed, .need{
    width: 207px;
  
  
  }
  .headfeature, .feature{
    width: 166px;
  
   }
  
  .headbenefits, .benefits{
    width: 260px;
  
   }
  
  }
  
  /* End benefits table */
  </code></pre>