`grid` property structure

[askirmas]

Structure

Table

Considering input table n+2 * n+2

inline?	column-gap	column sizes	... n	auto-columns
row-gap	flow	column names	...	last_line-end
row sizes	row names	areas	<	∅
... n	...	^	.	∅
auto-rows	last_line-end	∅	∅	∅

List

Shorthanded list: https://developer.mozilla.org/en-US/docs/Web/CSS/grid#Specifications

• display @ [0; 0]
• grid-template-rows:
  • sizes @ [0; 2 -- n]
  • names @ [1; 2 -- n+1]
• grid-template-columns:
  • sizes @ [2 -- n; 0]
  • names @ [2 -- n+1; 1]
• grid-template-areas @ [2 -- n; 2 -- n]
• grid-auto-rows @ [0; n+1]
• grid-auto-columns @ [n+1; 0]
• grid-auto-flow @ [1; 1]
• grid-column-gap
• grid-row-gap
• column-gap @ [1; 0]
• row-gap @ [0; 1]

Notes

• grid-template-columns: repeat(auto-fill, [col-start] 1fr);
• subgrid