Twitter Bootstrap features

Something which is always available in YiiBooster


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

Look, I'm in a well!
	<div class="well">

Optional classes

Control padding and rounded corners with two optional modifier classes.

Look, I'm in a well!
	<div class="well well-large">
Look, I'm in a well!
	<div class="well well-small">

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.


Float an element left

	.pull-left {
	  float: left;


Float an element right

	.pull-right {
	  float: right;


Change an element's color to #999

	.muted {
	  color: #999;


Clear the float on any element

	.clearfix {
	  *zoom: 1;
	  &: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>