Aggiungi bordo a fa-circle

Question

Come posso aggiungere un bordo all'icona circle da Font Awesome? In realtà il mio risultato è:

http://jsfiddle.net/0jhdvj0k/

Il confine è qualcosa come i puntini di sospensione, invece un bordo circolare.

<table class="table table-condensed table-hover table-striped"> 
    <thead> 
     <tr> 
      <th></th> 
      <th>AAAA</th> 
      <th>AAAA</th> 
      <th>AAAA</th> 
      <th>AAAA</th> 
      <th>AAAA</th> 
      <th>AAAA</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr> 
      <td style="width: 55px;" class="text-center" style="padding-top: 5px; width: 25px;"><span class="label label-success" style="margin-bottom: 3px; display: inline-block; width: 100%; height: 22px; padding-top: 2px;"><i class='fa fa-check' style="font-size: 18px;"></i></span><span style='position: relative; top: -15px; right: 0px; left: 15px;'><span class='fa-stack fa-lg'><i class='fa fa-circle fa-stack-2x text-info' style='border-radius: 100%; border: 2px solid #5cb85c;'></i><span class='fa fa-stack-1x fa-inverse' style='top: 3px;'>6</span></span></span></td> 
      <td>text</td> 
      <td>text</td> 
      <td>text</td> 
      <td>text</td> 
      <td>text</td> 
      <td>text</td> 
     </tr> 
    </tbody> 
</table> 

Answer 1

Aggiunto line-height: 30px; su text-info per fissare il cerchio, e ha cambiato fa-inversetop: 0px a verticale numero del centro 6

<i class="fa fa-circle fa-stack-2x text-info" style="border-radius: 100%; border: 3px solid #5cb85c; line-height: 30px;"></i> 
<span class="fa fa-stack-1x fa-inverse" style="top: 0px;">6</span> 

http://jsfiddle.net/1qzqu83m/

Answer 2

Non è necessario utilizzare FontAwesome per un cerchio con bordi. In realtà è più facile da usare CSS puro perché non c'è bisogno di ripristinare FontAwesome styling:

.circle-border { 
 
     display: inline-block; 
 
     color: black; 
 
     font: 18px sans-serif; 
 
     background: yellow; 
 
     border:2px solid green; 
 
     width: 30px; 
 
     height: 30px; 
 
     border-radius:17px; /* half of width + borders */ 
 
     line-height: 34px; /* vertical center */ 
 
     text-align: center; /* horizontal center */ 
 
    }

<div class="circle-border">6</div>