@teft/grid
v5.1.4
Published
CSS grid for Teft.
Downloads
10
Readme
Grid
While it is possible to override the number of columns used by the grid package, we strongly recommend using 12 columns. A lot of the functionality built upon Teft is based on 12 columns and there will be a lot of work to make everything compatible with a custom columns setup.
Installation
Install the module
npm install @teft/grid
Variables
| Name | Default value | | ------------------- | --------------------- | | --teft-grid-gap | var(--teft-theme-gap) | | --teft-grid-columns | 12 |
Examples
Basic Grid Setup
CSS
.example-left-column {
grid-column-end: 4;
grid-column-start: 1;
}
.example-right-column {
grid-column-end: 12;
grid-column-start: 4;
}
Markup
<div class="teft-grid">
<div class="example-left-column">
<p>Left column</p>
</div>
<div class="example-right-column">
<p>Right column</p>
</div>
</div>