基础进度栏，全角文字

Question

基金会官方文件显示了progress bar with text的用法。但是，该文本位于填充部分内，一旦进度条填充了0％（example），它就会中断。

<div class="progress" role="progressbar" tabindex="0" aria-valuenow="25" aria-valuemin="0" aria-valuetext="25 percent" aria-valuemax="100">
  <span class="progress-meter" style="width: 0%">
    <p class="progress-meter-text">the text is broken here</p>
  </span>
</div>

无论如何，我们可以将文本放在整个进度条的中心，而不是填充部分吗？