
The grid layout in each of the images is represented in the form of a matrix with 3 rows and 5 columns. Every cell represents a grid area and has a specific index value. An extension of the grid area horizontally or vertically is represented by repeating index values. Blank spaces are represented by two dots.
Image 1 shows a grid layout labeled grid hyphen template hyphen areas colon. It is represented by the following index values. Row 1: open double quotes dot dot “a” 1 “a” 2 “a” 3 “a” close double quotes. Row 2: open double quotes b 1 b 2 b 2 b 2 b 3 close double quotes. Row 3: open double quotes b 1 c 1 c 2 c 2 c 2 close double quotes semicolon.
Image 2 shows a grid layout labeled grid hyphen template hyphen areas colon. It is represented by the following index values. Row 1: open double quotes “a” 1 “a” 2 “a” 3 “a” 4 b 3 close double quotes. Row 2: open double quotes b 1 b 2 b 2 b 2 b 3 close double quotes. Row 3: open double quotes b 1 c 1 c 2 c 2 b 3 close double quotes semicolon.
Image 3 shows a grid layout labeled grid-template hyphen areas colon. It is represented by following index values. Row 1: open double quotes b 1 “a” 2 “a” 3 c 2 “a” 4 close double quotes. Row 2: open double quotes b 1 b 2 c 1 c 2 b 3 close double quotes. Row 3: open double quotes “a” 1 “a” 1 c 1 dot dot b 3 close double quotes semicolon.
Back