Grids
Align
.align-start
.align-start
.align-start
.align-center
.align-center
.align-center
.align-end
.align-end
.align-end
.align-self-start
.align-self-center
.align-self-end
Breakpoints
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-2
.v-col-auto
Justify
.justify-start
.justify-start
.justify-center
.justify-center
.justify-end
.justify-end
.justify-space-around
.justify-space-around
.justify-space-between
.justify-space-between
No Gutters
.v-col-12
.v-col-6
Offset
.v-col-4
.v-col-4 .offset-4
.v-col-3 .offset-3
.v-col-3 .offset-3
.v-col-6 .offset-3
Offset Breakpoint
.v-col-sm-5 .v-col-md-6
.v-col-sm-5 .offset-sm-2 .v-col-md-6 .offset-md-0
sm-6 md-5 lg-6
.v-col-sm-6 md-5 .offset-md-2 .v-col-lg-6 .offset-lg-0
Order
First in markup, but middle in row
Second in markup, but last in row
Third in markup, but first in row
Order First and Last
First, but last
Second, but unordered
Third, but first
Column Wrapping
.v-col-9
.v-col-4
.v-col-6
Equal Width Column
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-auto
Grow and Shrink
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-8
.v-col-4
Margin
.v-col-md-4
.v-col-md-4 .ml-auto
.v-col-md-4 .ml-md-auto
.v-col-md-4 .ml-md-auto
.v-col-auto .mr-auto
.v-col-auto
Nested Grid
Level 1: .v-col-8
Level 2: .v-col-8
Level 2: .v-col-4
Level 1: .v-col-4
One Column Width
.v-col-auto
.v-col-6
.v-col-auto
.v-col-auto
.v-col-2
.v-col-auto
Spacer
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-auto
.v-col-auto
Unique Layout
.col-12 .col-md-8
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6 .col-md-4
.col-6
.col-6
Variable content width
1 of 3
Variable width content
3 of 3
1 of 3
Variable width content
3 of 3