Grid System for Contao4 based on CSS Grid
Add columns to your page content.
Contao Clickpress Grid uses CSS Grid and so less HTML is needed.
- Enable the prebuilt CSS Grid in your Contao page layout or generate your own CSS.
- Add a new content element from type "Gridset start" - "Gridset end" will be autogenerated
- Edit your column configuration in the "Gridset start" content element
- Place some elements between "Gridset start" and "Gridset end".
If you need two content elements in a column, wrap them between the elements "Column start" and "Column end".
This is the result of a 40% 30% 30% setting on desktop. So, three columns will be displayed in a row. The fourth column will be placed in a new row, automatically.
<div class="grid_desktop_40_30_30 ..."> <div class="ce_text">...</div> <div class="ce_text">...</div> <div class="ce_image">...</div> <div class="ce_text">...</div> <div class="ce_text">...</div> </div>
Big thanks to rocksolid_columns for some parts of the module.