</div>
{% endhighlight %}
- <h3 id="progress-low-percentages">Low percentages</h3>
- <p>Progress bars representing low single digit percentages, as well as 0%, include a <code>min-width: 20px;</code> for legibility.</p>
- <div class="bs-example">
- <div class="progress">
- <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
- 0%
- </div>
- </div>
- <div class="progress">
- <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="width: 2%;">
- 2%
- </div>
- </div>
- </div>
-{% highlight html %}
-<div class="progress">
- <div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100">
- 0%
- </div>
-</div>
-<div class="progress">
- <div class="progress-bar" role="progressbar" aria-valuenow="2" aria-valuemin="0" aria-valuemax="100" style="width: 2%;">
- 2%
- </div>
-</div>
-{% endhighlight %}
-
-
<h3 id="progress-alternatives">Contextual alternatives</h3>
<p>Progress bars use some of the same button and alert classes for consistent styles.</p>
<div class="bs-example">