master-co / css

The CSS Language and Framework
https://css.master.co
MIT License
1.82k stars 41 forks source link

📄 Easy grid systems? #329

Open aolko opened 9 months ago

aolko commented 9 months ago

Description

Will we have a predefined grid systems based on variable number of --columns (both flex and grid), like these ones:

1aron commented 9 months ago

Master CSS's grid system is arbitrary and more flexible than the traditional 12-column, 16-column, or 24-column.

<!-- grid -->
<div class="grid-cols:5 grid-cols:6@sm grid-cols:8@md grid-cols:16@lg gap:5x gap:6x@sm">...</div>

<!-- flex -->
<div class="flex gap:5x">
    <div class="w:1/4 w:1/6@sm">...</div>
    <div class="w:1/4 w:2/6@sm">...</div>
    <div class="w:2/4 w:3/6@sm">...</div>
</div>

The documentation of the grid system has indeed been missing since v1. We will add a new page docs/grid-system during the 2.0 RC.

https://css.master.co/docs/grid-columns