Syntax

Grid Column

Setting a grid items's size and location in a grid layout.

🚧This page is still under construction and some content may not be complete.

Overview

ClassDeclarations
grid-col:valuegrid-column: value;
grid-col-span:valuegrid-column: span value/span value;
grid-col-start:valuegrid-column-start: value;
grid-col-end:valuegrid-column-end: value;

Conditionally apply

Apply styles based on different states using selectors and applying conditionally.

<div class="grid-column:1:hover grid-column:1@sm grid-column:1@dark grid-column:1@print"></div>
Design Token
Colors

Customizing color variables or starting with the crafted palette.

© Aoyue Design LLC.