Skip to main content English Español Light Dark System

Grid

<gstock-grid> | GstockGrid

API

Properties

Name Description Reflects Type Default
type The type of grid layout. - fluid: Stretches to fill all available space - fixed-narrow: Fixed width ideal for content-focused pages (max 760px) - fixed-wide: Fixed width ideal for data-dense pages (max 1280px) Reflects 'fluid' | 'fixed-narrow' | 'fixed-wide' 'fluid'
updateComplete

A read-only promise that resolves when the component has finished updating.

Learn more about attributes and properties .

Slots

Name Description
default The grid items (gstock-grid-item elements).

Learn more about slots .

Custom Properties

Name Description Default
--gstock-grid-columns Number of columns in the grid (auto-calculated by breakpoints).
--gstock-grid-gutter Space between grid items (auto-calculated by breakpoints).
--gstock-grid-margin Left and right margins (auto-calculated by breakpoints).
--gstock-grid-max-width-fixed-narrow Maximum width for fixed-narrow type (default: 760px).
--gstock-grid-max-width-fixed-wide Maximum width for fixed-wide type (default: 1280px).

Learn more about custom properties .

CSS Parts

Name Description
base The grid container element.

Learn more about CSS parts .