Here is a progress bar at the very top of a card.
<div class="row">
<div class="col-xs-12 col-sm-6">
<div class="card">
<div class="card-block">
<h4 class="card-title">Card title</h4>
<p class="card-text">Here is a progress bar at the very top of a card.</p>
<div class="progress-block">
<label>Label</label>
<div class="progress-static">
<div class="progress-meter" data-value="..."></div>
</div>
</div>
<div class="progress-block">
<label>Longer Label</label>
<div class="progress-static">
<div class="progress-meter" data-value="..."></div>
</div>
</div>
<div class="progress-block">
<label>Really, Really, Really Long Label</label>
<div class="progress success">
<progress value="..." max="100" data-displayval="...%"></progress>
</div>
</div>
</div>
<div class="card-footer">
<div class="progress-static top">
<div class="progress-meter" data-value="..."></div>
</div>
<a href="..." class="card-link">Click</a>
</div>
</div>
</div>
</div>