Grid

Introduction

The CSS Grid Layout Module offers a grid-based layout system, with rows and columns, making it easier to design web pages without having to use floats and positioning.

Grid Properties

PropertyValuesDescription
Grid Template Columnsnumber
Specifies the number (and the widths) of columns in a grid layout.
Grid Template Rowsnumber
Specifies the number (and the heights) of the rows in a grid layout.
Justify Itemsnormal, center, start, end
Defines how the items will be aligned horizontally in each column.
Align Items
normal, center, start, end
Defines how the items will be aligned vertically in each row.
Grid Column GapnumberDefines the size of the gap between the columns in a grid layout.
Grid Row GapnumberDefines the size of the gap between the rows in a grid layout.
Was this article helpful?
YesNo

Couldn't Find Your Answer?

Get quality customer support with our professional support team.

Create A Support Ticket
Live Editor