title: Arrange html element in circle with css and jquery
body: <p>I have a set of 7 jQuery UI <a href="http://jqueryui.com/demos/button/" rel="nofollow">buttons</a>. Precisely speaking, Buttonset.</p>
  
  <p>I want to arrange all buttons in a circle.
  How can I arrange them in that fashion with CSS (CSS3 is out of game- seek a cross browser solution) and jQuery?</p>
  
  <p>I have seen a few plugins:</p>
  
  <p>1) <a href="http://addyosmani.com/blog/jquery-roundrr/" rel="nofollow">Roundrr</a> </p>
  
  <p>2) <a href="http://github.com/addyosmani/js-shapelib" rel="nofollow">jsshapelib</a></p>
  
  <p>and few demos <a href="http://www.piccante.co/?pg=circularmenus" rel="nofollow">here</a></p>
  
  <pre><code>&lt;div class="button-wrapper"&gt;
      &lt;button id="button-1" class="circle" &gt;1&lt;/button&gt;
      &lt;button id="button-2" class="circle" &gt;2&lt;/button&gt;
      &lt;button id="button-3" class="circle" &gt;3&lt;/button&gt;
      &lt;button id="button-4" class="circle" &gt;4&lt;/button&gt;
      &lt;button id="button-5" class="circle" &gt;5&lt;/button&gt;
      &lt;button id="button-6" class="circle" &gt;6&lt;/button&gt;
      &lt;button id="button-7" class="circle" &gt;7&lt;/button&gt;    
  &lt;/div&gt;
  </code></pre>
  
  <p>Looking for a jQuery solution to arrange all children of <code>#button-wrapper</code> in a circle within height and width of <code>#button-wrapper</code>.</p>