title: extjs 4.2.1 - ie8 and round corners / drawing circles in Ext.Components
body: <p>In our app, we have a button defined as follows:</p>
  
  <pre><code>{
   xtype       : 'button',
   text        : '&lt;span class="disk"&gt;1&lt;/span&gt; Define Layout'
  }
  </code></pre>
  
  <p>where disk is described like this:</p>
  
  <pre><code>.disk {
          display: inline-block;
          vertical-align : middle;
          background-color: #FFF;
          margin-right: 5px;
          //margin-bottom: -7px;
          padding: 12px 8px !important;
          height: 25px;
          overflow: hidden;
          width: 25px;
          border-radius: 25px;
          color: #555;
          line-height: 0px;
      }
  </code></pre>
  
  <p>This works fine in ie9+, ff, and chrome.  However, in ie8 all I see is squares. I am aware of the fact that border-radius is not part of the IE8 CSS spec and that there are work arounds like CSS3PIE (assume we can't use this :) ).  Also, I know that Sencha Cmd (v4.0.2.67) has image slicing built into the build system, but it only seems to work on Ext components.  How do I draw the disk for this particular case?</p>