scss_grid

Is a basic grid system i use in most projects, so have placed in its own repository.

Column helpers

.col-quarter

.col-third

.col-half

.col-three-quarters

.col-full

Basic columns (No Breakpoint)

.col-1

.col-2

.col-3

.col-4

.col-5

.col-6

.col-7

.col-8

.col-9

.col-10

Meduim columns (min-width: 600px)

.m-col-1

.m-col-2

.m-col-3

.m-col-4

.m-col-5

.m-col-6

.m-col-7

.m-col-8

.m-col-9

.m-col-10

Large columns (min-width: 1025px)

.l-col-1

.l-col-2

.l-col-3

.l-col-4

.l-col-5

.l-col-6

.l-col-7

.l-col-8

.l-col-9

.l-col-10

Align

Left align .grid or .grid-left

Center align .grid-center

Right align .grid-right

Single column left align

.left

.m-left

.l-left

Single column center align

.center

.m-center

.l-center

Single column right align

.right

.m-right

.l-right

Offsets

Basic offsets .push-right-, .push-left- (No Breakpoint)

.push-right-1

.push-right-2

.push-right-3

.push-right-4

.push-right-5

.push-left-1

.push-left-2

.push-left-3

.push-left-4

.push-left-5

Meduim offset .m-push-right-, .m-push-left- (min-width: 600px)

.m-push-right-1

.m-push-right-2

.m-push-right-3

.m-push-right-4

.m-push-right-5

.m-push-left-1

.m-push-left-2

.m-push-left-3

.m-push-left-4

.m-push-left-5

Large columns .l-push-right-, .l-push-left- (min-width: 1025px)

.l-push-right-1

.l-push-right-2

.l-push-right-3

.l-push-right-4

.l-push-right-5

.l-push-left-1

.l-push-left-2

.l-push-left-3

.l-push-left-4

.l-push-left-5