Images
.img-responsive
Applies max-width: 100%; and height: auto; to the image so that it scales nicely to the parent element
.img-rounded
Adds rounded 3px
border radius to the image
.img-circle
Makes image fully rounded
.img-thumbnail
Adds grey frame with white background color
.img-lg (*-sm, *-xs)
Optional custom sizing. Added specially for media lists
.img-* (*-10, *-15, *-20, *-30, *-40, *-50, *-60, *-70, *-80, *-90, *-100)
Optional image width
Styling
.border-*
Adds 1px
border to the element, if it doesn't have it already. Available in 4 positions: top, bottom, left, right
.border-lg
Changes border width to 2px
.border-*-lg
You can specify border position: left, right, top and bottom
.border-xlg
Changes border width to 3px
.border-*-xlg
You can specify border position: left, right, top and bottom
.no-border-radius
Removes border radius from the element. To use add .*-top (bottom, left, right)
.cursor-move
Changes cursor style to move
. Mostly used in sortable components
.cursor-pointer
Changes cursor style to pointer
. Useful for user interaction feedback
.cursor-default
Changes cursor style to default
Positioning
.center-block
Set an element to display: block
and center via margin
.position-relative
Changes element's positiion to relative
.position-static
Changes element's positiion to static
.pull-left
Float an element to the left
with a class
.pull-right
Float an element to the right
with a class
.clearfix
Easily clear floats by adding .clearfix
to the parent element
.position-left
Add extra right
margin to the element
.position-right
Add extra left
margin to the element
Spacing
.m-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px margin to the element
.m-t-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px top margin to the element
.m-b-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px bottom margin to the element
.m-l-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px left margin to the element
.m-r-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px right margin to the element
.no-margin
Removes element's margin
.no-margin-top
(*-bottom, *-left, *-right)
Removes margin of the specified side
.p-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px padding to the element
.p-t-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px top padding to the element
.p-b-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px bottom padding to the element
.p-l-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px left padding to the element
.p-r-5
(*-10, *-15, *-20)
Add 5
, 10
, 15
and 20
px right padding to the element
.no-padding
Removes element's padding
.no-padding-top
(*-bottom, *-left, *-right)
Removes padding of the specified side