如何在引导程序进度条中垂直对齐文本

Question

我修改了bootstrap进度条的高度,如下面的链接所示:http: //jsfiddle.net/8Xf2j/31/

我想要做的是文本垂直居中.我试图添加属性:

vertical-align:middle

但它不起作用...我还想增加包含进度条添加的文本的字体大小:

font-size:30px;

正如你在小提琴中看到的那样它也不起作用.任何想法或建议将不胜感激.

Answer 1

实现单行文本垂直对齐的一种方法是使line-height匹配达到所需的高度.

示例: http ://jsfiddle.net/VQS2k/

.progress {
    height: 40px;
    font-size: 30px;
}
.bar {
    font-size: 30px;
    line-height: 40px;
}

普通版(无Bootstrap): http ://jsfiddle.net/VQS2k/1/