XL Grid

.col-xl-4
.col-xl-4
.col-xl-4

LG Grid (Collapsed at 992px)

.col-lg-4
.col-lg-4
.col-lg-4

MD Grid (Collapsed at 768px)

.col-md-4
.col-md-4
.col-md-4

SM Grid (Collapsed at 576px)

.col-sm-4
.col-sm-4
.col-sm-4

XS Grid

.col-4
.col-4
.col-4

Equality Width

col
col
col
col
col

Setting one column width

col
col-6
col

Mix and Match (Showing different sizes on different screens)

col-12 col-md-8
col-6 col-md-6
col-sm-6 col-md-3
col-sm-6 col-md-3
col-sm-6 col-md-3
col-sm-6 col-md-3
col-6
col-6

Offset Grid (Adding some space when needed)

col-md-4
col-md-4 ml-auto
col-md-4 ml-auto mr-auto
col-md-4 ml-auto mr-auto
col-md-6 ml-auto mr-auto
...
Chad Active 2h ago
...
Chad
Hello, Rian
12.31
Hello, Chad
What's up?
12.35
...
Chad
Thanks
When is the deadline of the project we are working on ?
13.00
The deadline is about 2 months away
13.10
...
Chad
Ok, Thanks !
13.15
Today
Tomorrow
Add Task
General Settings
  • Enable Notifications
  • Signin with social media
  • Backup storage
  • SMS Alert
Notifications
  • Email Notifications
  • New Comments
  • Chat Messages
  • Project Updates
  • New Tasks
Settings

Logo Header


Navbar Header


Sidebar

Background