Blueprint Documentation: Grid Module

The Reset module provides mixins that allow you to reset your html so that every element has browser-supplied no styling. The source of the reset module can be found here.

Importing

To import the Compass Reset Module to any Sass File:

@import compass/reset

Class & Element Mixins

Class mixins provide classes or define styles for elements. These will be scoped according to the selector you mix them into.

+blueprint-grid

Mix into a selector to get all the blueprint grid CSS classes scoped by that selector.

Style Mixins

Style mixins provide styles that can be mixed into any selector.

Mixin	Description
+container	Defines the selector as container of columns.
+column(n[, last])	Defines the selector as a column. The first argument is the number of grid units to span and the second argument is a boolean that indicates whether the column is the last in the current row. E.g. +column(12) or +column(8, true)
+span(n[, last])	Defines the selector as spanning n grid units in width without bringing along the other column styles. This is useful on non div elements where alignment is required but floating is not. The first argument is the number of grid units to span and the second argument is a boolean that indicates whether the column is the last in the current row. E.g. +span(12) or +span(8, true)
+last	Declares a column is the last column in its row. This mixin is useful when you need to apply last styles separately from the column declaration. E.g. +last
+append(n)	Appends n grid units to the right of the column. E.g. +append(2)
+prepend(n)	Prepends n grid units to the left of the column. E.g. +prepend(2)
+pull(n)	Move a column n grid units to the left. E.g. +pull(2)
+push(n)	Move a column n grid units to the right. E.g. +push(2)
+border	Border on right hand side of a column.
+colborder	Border on right hand side of a column. Consumes one grid unit.
+colruler	Mixin to an hr that should span the column containing it.
+colspacer	Mixin to an hr that should span the column containing it but not be visible (adds vertical space)

Constants
| Name | Overridable? | Default Value | Description |
| !layout_grid_columns | No | 24 | The number of grid units within a container. |
| !layout_grid_width | No | 30px | The width of a grid unit less the grid margin |
| !layout_grid_margin | No | 10px | The width of a grid margin |
| !layout_grid_outer_width | No | 40px | The width of a grid unit |
| !layout_grid_size | No | 950px | The width of a grid container |