The grid system was mentioned earlier. You can find an extensive explanation here.
For any questions you can use our support-forum. If necessary, we will expand on this topic.
Within a page or a post you can use this grid-system via a shortcode, in order to, for example, display two text-areas side by side.
Before we start with the actual shortcode, here again a little explanation of the grid-system.
|Grid-Behaviour||Continuously horizontal||Initially minimized, above breakpoints horizontal|
|Padding width||30px (15px on any side of a column)|
Note: In our example we work with the prefix „col-sm-3”. Obviously this value has to be adjusted to the desired size.
IMPORTANT: Around the listing of the individual col-tags, there always has to be a row-shortcode.
|class||col-sm-3||Via this value you can define the width of the container.|
|col-sm-offset-3||Via the prefix offset you can define paddings. With col-sm-offset-3 this container starts, for example, after the third column.|
|col-sm-push-3||With the help of push and pull you can move columns to the left/right, or rearrange them. By doing this you can, for example, display the sidebar on the left on a desktop device and still load it in on a smartphone after the content (effectively on the right).|
All classes can be completely mixed individually.
Was this article helpful?