1. Hyper
  2. UI Kit
  3. Grid System

Grid System

Grid options

See how aspects of the Bootstrap grid system work across multiple devices with a handy table.

Extra small
<576px 		Small
≥576px 		Medium
≥768px 		Large
≥992px 		Extra large
≥1200px
Max container width None (auto) 540px 720px 960px 1140px
Class prefix .col- .col-sm- .col-md- .col-lg- .col-xl-
# of columns 12
Gutter width 30px (15px on each side of a column)
Nestable Yes
Column ordering Yes

Grid Example

col-lg-12
col-lg-11
col-lg-1
col-lg-10
col-lg-2
col-lg-9
col-lg-3
col-lg-8
col-lg-4
col-lg-7
col-lg-5
col-lg-6
col-lg-6
col-lg-5
col-lg-7
col-lg-4
col-lg-8
col-lg-3
col-lg-9
col-lg-2
col-lg-10
col-lg-1
col-lg-11
col-lg-2
col-lg-3
col-lg-4
col-lg-2
col-lg-1
Settings
Basic Settings
Recent Activity
You sold an item Paul Burgess just purchased “Hyper - Admin Dashboard”!

5 minutes ago

Product on the Bootstrap Market Dave Gamache added Admin Dashboard

30 minutes ago

Robert Delaney Send you message "Are you there?"

2 hours ago

Audrey Tobey Uploaded a photo "Error.jpg"

14 hours ago

You sold an item Paul Burgess just purchased “Hyper - Admin Dashboard”!

1 day ago