Progress Bars

Progress bars list the steps in a process and identify which step a user is on.

Usage

Use progress bars to orient users within a series of steps in a process or to indicate level of progress toward completion of a goal or task.

Example

sample progress bar
<ul class="progressbar">
	<li class="progress-item complete"><a href="#">Item Complete</a></li>
	<li class="progress-item complete"><a href="#">Item Complete</a></li>
	<li class="progress-item current"><span>Current Item</span></li>
	<li class="progress-item disabled"><span>Upcoming Item</span></li>
</ul>