title: How to center align content in a DIV tag
body: <p>I have two <code>div</code> tags:</p>
  
  <pre><code>&lt;div id="parent"&gt;
      &lt;div id="content"&gt;
            //content
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>the content of the <code>&lt;div id="content"&gt;</code> is added dynamically so I don't know its width and I can't set <code>width</code> and <code>margin</code> to it.</p>
  
  <p>How can I center align <code>&lt;div id="parent"&gt;</code> content?</p>
  
  <p>PS: I don't want to use javascript to do this.</p>