reorder Cork UI

search

What?

Introduction

Template Columns

Template areas

Grid

Grid is a layout for managing grid layouts.The grid system is implemented with the Grid component:

Template Columns

Here's an example of using grid template columns with the grid component, and applying a gap or space between the grid items.

Column 1

Column 2

Column 3

Column 4

Template Area

The templateAreas prop specifies areas within the grid layout. Use template literals to name the area. Now you can reference the area by passing area prop in the component.

Header

Sidebar

Main Content

Footer