9 merge requests!28721Hot test,!27561Adds font-weight-medium to font weight classes,!22391V4 dev,!22143Fix selectable disabled toggle radio buttons,!22598test,!25326Adjust examples,!23995Add back cursor: pointer for .btn-link,!23178Spinner,!17021v4
@@ -18,7 +18,7 @@ Progress components are built with two HTML elements, some CSS to set the width,
...
@@ -18,7 +18,7 @@ Progress components are built with two HTML elements, some CSS to set the width,
- We use the `.progress` as a wrapper to indicate the max value of the progress bar.
- We use the `.progress` as a wrapper to indicate the max value of the progress bar.
- We use the inner `.progress-bar` to indicate the progress so far.
- We use the inner `.progress-bar` to indicate the progress so far.
- The `.progress-bar` requires an inline style or custom CSS to set their width.
- The `.progress-bar` requires an inline style, utility class, or custom CSS to set their width.
- The `.progress-bar` also requires some `role` and `aria` attributes to make it accessible.
- The `.progress-bar` also requires some `role` and `aria` attributes to make it accessible.
Put that all together, and you have the following examples.
Put that all together, and you have the following examples.
...
@@ -41,6 +41,14 @@ Put that all together, and you have the following examples.
...
@@ -41,6 +41,14 @@ Put that all together, and you have the following examples.
</div>
</div>
{% endexample %}
{% endexample %}
Bootstrap provides a handful of [utilities for setting width]({{ site.baseurl }}/utilities/sizing-and-positioning/#width-and-height). Depending on your needs, these may help with quickly configuring progress.