带有英雄单元文本的 Twitter Bootstrap 进度条未正确显示
Posted
技术标签:
【中文标题】带有英雄单元文本的 Twitter Bootstrap 进度条未正确显示【英文标题】:Twitter Bootstrap progress bar with text in hero-unit is not displayed properly 【发布时间】:2012-12-14 22:25:54 【问题描述】:如果标准 Twitter Bootstrap 进度条在 <div class="hero-unit">
内,我对带有一些文本的标准 Twitter Bootstrap 类有问题:
<div class="hero-unit">
<div class="container">
<div class="progress progress-striped active">
<div class="bar" style="width: 80%;">80%</div>
</div>
</div>
</div>
这是一个jsFiddle 代码,表明文本没有正确对齐。 为什么会发生这种情况以及如何解决?我试图修复它,但没有运气。
谢谢。
【问题讨论】:
【参考方案1】:是hero-unit
上的line-height: 30px
导致了问题。
我已经像这样更改代码:
<div class="hero-unit" style="line-height: inherit">
当然最好给它分配一个类,而不是使用样式属性。
【讨论】:
以上是关于带有英雄单元文本的 Twitter Bootstrap 进度条未正确显示的主要内容,如果未能解决你的问题,请参考以下文章