title: How to align a paragraph to center of cell in table
body: <p>I want the paragraph in the second row to be aligned to center of table. How can I do that?</p>
  
  <p><a href="http://jsfiddle.net/MqgYw/" rel="nofollow">Full HTML &amp; CSS code in this link</a></p>
  
  <p>CSS:</p>
  
  <pre><code>table {
      width:100%;
  }
  table, td {
      border-collapse:collapse;
      border:1px solid black;
      padding:0px 5px 10px;
  }
  .separate {
      text-align:center;
  }
  .separate p{
      border:1px solid lightgray;
      width:50%;
  }
  </code></pre>
  
  <p>table:</p>
  
  <pre><code>&lt;table&gt;
      &lt;tr&gt;
          &lt;td&gt;AAA&lt;/td&gt;
          &lt;td&gt;BBB&lt;/td&gt;
          &lt;td&gt;CCC&lt;/td&gt;
      &lt;/tr&gt;    
      &lt;tr&gt;
          &lt;td colspan="3" class="separate" &gt;
              &lt;p&gt;paragrap&lt;/p&gt;
          &lt;/td&gt;
      &lt;/tr&gt;
  &lt;/table&gt;
  </code></pre>