EMAIL NEWSLETTER
Deliver the best gear and travel inspiration straight to your inbox.
Class | Properties |
---|---|
col-12 | width: 100%; |
col-11 | width: 91.66666667% |
col-10 | width: 83.33333333%; |
col-9 | width: 75% |
col-8 | width: 66.66666667%; |
col-7 | width: 58.33333333%; |
col-6 | width: 50%; |
col-5 | width: 41.66666667%; |
col-4 | width: 33.33333333%; |
col-3 | width: 25%; |
col-2 | width: 16.66666667% |
col-1 | width: 8.33333333%; |
Large Desktop | Normal Desktop | Small Desktop - Large Tablet | Tablet | Mobile |
---|---|---|---|---|
xl-col-12 | lg-col-12 | md-col-12 | sm-col-12 | xs-col-12 |
xl-col-11 | lg-col-11 | md-col-11 | sm-col-11 | xs-col-11 |
xl-col-10 | lg-col-10 | md-col-10 | sm-col-10 | xs-col-10 |
xl-col-9 | lg-col-9 | md-col-9 | sm-col-9 | xs-col-9 |
xl-col-8 | lg-col-8 | md-col-8 | sm-col-8 | xs-col-8 |
xl-col-7 | lg-col-7 | md-col-7 | sm-col-7 | xs-col-7 |
xl-col-6 | lg-col-6 | md-col-6 | sm-col-6 | xs-col-6 |
xl-col-5 | lg-col-5 | md-col-5 | sm-col-5 | xs-col-5 |
xl-col-4 | lg-col-4 | md-col-4 | sm-col-4 | xs-col-4 |
xl-col-2 | lg-col-2 | md-col-2 | sm-col-2 | xs-col-2 |
xl-col-1 | lg-col-1 | md-col-1 | sm-col-1 | xs-col-1 |
Class | Properties |
---|---|
kmd-content-full | width: 100%; |
kmd-content-lg | max-width: 1180px; |
kmd-content-md | max-width: 768px; |
kmd-content-sm | max-width: 680px; |
kmd-content-xs | max-width: 480px; |
kmd-content-xxs | max-width: 320px; |
kmd-content-full
kmd-content-lg
kmd-content-md
kmd-content-sm
kmd-content-xs
kmd-content-xxs
Column #1 - xl-col-11 lg-col-11 md-col-9 sm-col-12 xs-col-12
Column #2 - xl-col-1 lg-col-1 md-col-3 sm-col-12 xs-col-12
Column #1 - xl-col-5 lg-col-5 md-col-6 sm-col-12 xs-col-12 md-pos-1 sm-pos-1 xs-pos-1
Column #2 - xl-col-2 lg-col-2 md-col-12 sm-col-12 xs-col-12 md-pos-3 sm-pos-3 xs-pos-3
Column #3 - xl-col-5 lg-col-5 md-col-6 sm-col-12 xs-col-12 md-pos-2 sm-pos-2 xs-pos-2
Large Desktop | Normal Desktop | Small Desktop - Large Tablet |
---|---|---|
xl-1-of-10 | lg-1-of-10 | md-1-of-10 |
xl-2-of-10 | lg-2-of-10 | md-2-of-10 |
xl-3-of-10 | lg-3-of-10 | md-3-of-10 |
xl-4-of-10 | lg-4-of-10 | md-4-of-10 |
xl-5-of-10 | lg-5-of-10 | md-5-of-10 |
xl-6-of-10 | lg-6-of-10 | md-6-of-10 |
xl-7-of-10 | lg-7-of-10 | md-7-of-10 |
xl-8-of-10 | lg-8-of-10 | md-8-of-10 |
xl-9-of-10 | lg-9-of-10 | md-9-of-10 |
xl-10-of-10 | lg-10-of-10 | md-10-of-10 |
Example of mixed grid use 12 columns and 10 columns
Column #1 xl-4-of-10 lg-4-of-10 md-col-6 sm-col-12 xs-col-12
Column #1 xl-2-of-10 lg-4-of-10 md-col-6 sm-col-12 xs-col-12
Column #1 xl-4-of-10 lg-2-of-10 md-col-12 sm-col-12 xs-col-12
Test Content Text
Test Content Text
Test Content Text
Test Content Text