Center all the content inside div using Bootstrap 3

Question

I'm trying to center all the content inside a div with Bootstrap 3, however it's not working, it's centering only the textarea, not the content between the <span> tag, what's wrong with my code?

<style type="text/css">
    .col-centered{
        float: none;
        margin: 0 auto;
    }  
</style>


<div class="row">

     <div class="col-lg-8 col-centered"> <textarea class="form-control" rows="10"> </textarea>  

         <span>
          Informações: 
          <i id="demo">
             <div class="label label-default label-dismissible">Não iniciado</div>
          </i>
          | Carregadas: 
          <div id="carregada" class="label label-primary label-dismissible">0</div>
          | Testadas: 
          <div id="testado" class="label label-info label-dismissible">0</div>
          | Aprovadas: 
          <div id="CLIVE" class="label label-success label-dismissible">0</div>
          | Reprovadas: 
          <div id="CDIE" class="label label-danger label-dismissible">0</div>
        </span> 

     </div>

</div>

You can see on the screenshot it's not centered, it works the way I want with the tag <center>, but I'm not using it, because I read it has been deprecated.

Answer 1

I believe .col-centered is not used anymore?

Try text-center.

Have a look at Bootstrap Classes.

Answer 2

Is this what you want?

If so, just simply add text-align: center; to your .col-centered style.