title: Center align jquery ui-icon inside td
body: <p>I have such case, using gQGrid:</p>
  
  <pre><code>&lt;td role="gridcell" style="text-align:center;" title="" aria-describedby="BaseBetsGrid1_approved"&gt;
  &lt;span class="ui-icon ui-icon-closethick"/&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>How may i canter it?</p>
  
  <p>i was trying to wrap it in to div and took <code>wraptocenter</code> class from here: <a href="http://www.brunildo.org/test/img_center.html">http://www.brunildo.org/test/img_center.html</a></p>
  
  <pre><code>&lt;style type="text/css"&gt;
  .wraptocenter {
      display: table-cell;
      text-align: center;
      vertical-align: middle;
  }
  .wraptocenter * {
      vertical-align: middle;
  }
  /*\*//*/
  .wraptocenter {
      display: block;
  }
  .wraptocenter span {
      display: inline-block;
      height: 100%;
      width: 1px;
  }
  /**/
  &lt;/style&gt;
  &lt;!--[if lt IE 8]&gt;&lt;style&gt;
  .wraptocenter span {
      display: inline-block;
      height: 100%;
  }
  &lt;/style&gt;&lt;![endif]--&gt;
  
      &lt;td role="gridcell" style="text-align:center;" title="" aria-describedby="BaseBetsGrid1_approved"&gt;
      &lt;div class="wraptocenter"&gt;
      &lt;span class="ui-icon ui-icon-closethick"/&gt;
      &lt;/div&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>But it is does not help.</p>
  
  <p>How may i do that with minimum css styles?</p>
  
  <p>may be specifying <code>margin-left</code> would be easier?</p>