Wells

Use the well as a simple effect on an element to give it an inset effect.

	<div class="well">
	  ...
	</div>
	

Optional classes

Control padding and rounded corners with two optional modifier classes.

	<div class="well well-large">
	  ...
	</div>
	

	<div class="well well-small">
	  ...
	</div>
	

Close icon

Use the generic close icon for dismissing content like modals and alerts.

<button class="close">&times;</button>

iOS devices require an href="#" for click events if you rather use an anchor.

<a class="close" href="#">&times;</a>

Helper classes

Simple, focused classes for small display or behavior tweaks.

.pull-left

Float an element left

	class="pull-left"
	

	.pull-left {
	  float: left;
	}
	

.pull-right

Float an element right

	class="pull-right"
	

	.pull-right {
	  float: right;
	}
	

.muted

Change an element's color to #999

	class="muted"
	

	.muted {
	  color: #999;
	}
	

.clearfix

Clear the float on any element

	class="clearfix"
	

	.clearfix {
	  *zoom: 1;
	  &:before,
	  &:after {
	    display: table;
	    content: "";
	  }
	  &:after {
	    clear: both;
	  }
	}
	

Page header

Not part of any widget but worth to know: A simple shell for an h1 to appropriately space out and segment sections of content on a page. It can utilize the h1's default small, element as well most other components (with additional styles).

	<div class="page-header">
	  <h1>Example page header <small>Subtext for header</small></h1>
	</div>