title: Wrapping a text around a circular element
body: <p>I have 2 DIV's as shown below and I've been trying to get the text between the two circles to wrap around the inner circle as shown on the attacthed image. I have not been able to achieve the desired result.</p>
  
  <p><strong>HTML</strong></p>
  
  <pre><code>&lt;div id="outer-circle"&gt;
  
  This is just a test logo name    
  
      &lt;div id="inner-circle"&gt;
  
      &lt;/div&gt;&lt;!-- End Inner Circle --&gt;
  
  &lt;/div&gt;&lt;!-- End Outer Circle --&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>* {
      margin: 0 auto;
  }
  
  #inner-circle {
      width: 200px;
      height: 200px;
      border-radius: 100%;
      background-color: green;
      margin-top: 28px;
      position: relative;
  
  }
  
  #outer-circle {
      width: 300px;
      height: 300px;
      border-radius: 100%;
       background-color: blue;
      margin-top: 50px;
      text-align center;
      text-align: left;
  
  }
  </code></pre>
  
  <p><a href="http://jsfiddle.net/sleek/sFuLC/24/" rel="nofollow noreferrer">Click here to see current but undesired result</a></p>
  
  <p><strong>Example of desired result</strong><br/>
  <img src="https://i.stack.imgur.com/2p4Ls.png" alt="enter image description here"></p>