Contact Us:
- Marketing Communications
- Brown Hall
- Scranton, PA 18510
- The ÐÓ°ÉÔ°æ
- cms@scranton.edu
Grid
Breakpoints
We use 4 breakpoints
col-xs-{column}
col-sm-{column}
col-md-{column}
col-lg-{column}
Each {column}
is a number from 1 - 12
Main Breakpoints
$full: 1200px;
$large: 992px;
$tablet: 768px;
Only XS Breakpoints
col-xs-12
col-xs-1
col-xs-11
2/12
10/12 Columns
3/12
9/12 Columns
4/12 Columns
8/12 Columns
5/12 Columns
7/12 Columns
6/12 Columns
6/12 Columns
7/12 Columns
6/12 Columns
8/12 Columns
4/12 Columns
9/12 Columns
3/12
10/12 Columns
2/12
11/12 Columns
1/12
Small Breakpoints with full width on XS breakpoint
12/12 Columns
1/12
11/12 Columns
2/12
10/12 Columns
3/12
9/12 Columns
4/12 Columns
8/12 Columns
5/12 Columns
7/12 Columns
6/12 Columns
6/12 Columns
7/12 Columns
6/12 Columns
8/12 Columns
4/12 Columns
9/12 Columns
3/12
10/12 Columns
2/12
11/12 Columns
1/12
Medium Layout - Small breakpoint is half columns and XS is full width
12/12 Columns
1/12
11/12 Columns
2/12
10/12 Columns
3/12
9/12 Columns
4/12 Columns
8/12 Columns
5/12 Columns
7/12 Columns
6/12 Columns
6/12 Columns
7/12 Columns
6/12 Columns
8/12 Columns
4/12 Columns
9/12 Columns
3/12
10/12 Columns
2/12
11/12 Columns
1/12
Offsets, Pulls, Pushes
Offset by 6 Columns
Offset by 3 Columns
col-xs-6
Pulled by 3 Columns
Pushed by 3 Columns