Progress Bar with Label behind the actual "bar" using bootstrap

index.html

<div class="progress" style="height: 20px;">
  <div class="progress-bar progress-bar-stripped" role="progressbar"
    aria-valuenow="25" aria-valuemin="0" aria-valuemax="100" style="width: 50%">
    <span>30%</span>
  </div>
</div>

style.css

.progress {
    position:relative;
}
.progress strong {
    position:absolute;
    left:0;
    width:100%;
    text-align:center;
    z-index:2;
    color:black;
}