title: Making h3 element take the space as text inside it
body: <p>My requirement is to make an <code>h3</code> element take up only that amount of space as the text in it. Can't use <code>span</code> directly. I tried encapsulating <code>h3</code> element with <code>span</code> but it didn't work. The red color should have only the width as the text hello world.</p>
  
  <p>HTML code:</p>
  
  <pre><code>&lt;div class="parent"&gt;
    &lt;h3 class="center"&gt;hello world&lt;/h3&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS code:</p>
  
  <pre><code>.parent {
      padding-left:5px;
      overflow:auto;
      background-color:blue;
  }
  
  .center {
      text-align:center;
      overflow:auto;
      background-color:red;
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/845nLfcu/" rel="nofollow"><strong>JSFiddle</strong></a></p>