...
Responsive panel sizes from "akContainerSize" and the existing helper classes:
Displayed Column Number | Design Column Number | Responsive Panel Sizes | ||||
|---|---|---|---|---|---|---|
xxs ( < 480px ) | xs ( < 768px ) | sm ( < 992px ) | md ( < 1200px ) | lg ( > = 1200)
| ||
| 1 | 2 - 12 | .xs-lower-one-col | .xs-lower-one-col | |||
| 2 | 3 - 12 | .xs-lower-two-col | .xs-lower-two-col | |||
| 3 | 4 - 12 | .xs-lower-three-col | .xs-lower-three-col | 4 | ||
In the table above you can see the panel sizes starting from xxs, up to lg.
The predefined classes xs-lower-one-col, xs-lower-two-col, xs-lower-three-col when applied to block level containers will change the grid-column-template to the given number.In the table above you can see the panel sizes starting from xxs, up to lg.
For example xs-lower-two-col class applied on a 4 column block, will change that block to 2 columns layout starting at xs size, so both xs and xxs sizes will change the block to a 2 column layout.
...