Marilyn Tarter
Clemson, CABelinda Connor
Fort Kent, MEBritanny Cevallos
Shiboygan Falls, WIBrandon Lawrence
Snohomish, WAAndrew Wiggins
Springfield, MATheodore Gristen
Nashville, TNDeborah Miner
North Shore, CAMarilyn Tarter
Clemson, CABelinda Connor
Fort Kent, MEBritanny Cevallos
Shiboygan Falls, WIBrandon Lawrence
Snohomish, WAAndrew Wiggins
Springfield, MATheodore Gristen
Nashville, TNDeborah Miner
North Shore, CAStylize progress element with a few extra classes and some crafty browser-specific css.
A basic progress in all different colors.
Source Code
<div class="progress mg-b-20"> <div class="progress-bar bg-success wd-35p" role="progressbar" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div></div>Class Reference
| Class | Value |
|---|---|
class="progress-bar bg-[value]"
|
primary | success | warning | danger | info | teal | indigo | purple | orange | pink |
A striped progress in all different colors.
Source Code
<div class="progress mg-b-20"> <div class="progress-bar progress-bar-striped wd-35p" role="progressbar" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div></div>A basic progress in different sizes.
Size Super Extra SmallSource Code
<div class="progress mg-b-20 ht-10"> <div class="progress-bar wd-35p" role="progressbar" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100"></div></div>Class Reference
| Class | Value |
|---|---|
class="progress-bar ht-2"
|
A super extra small size of progress using the .ht-2class.
|
A basic progress with labels centered.
Source Code
<div class="progress mg-b-20"> <div class="progress-bar wd-35p" role="progressbar" aria-valuenow="35" aria-valuemin="0" aria-valuemax="100">35%</div></div>