This is the text content to describe images [1] and [2]. It is positioned between the two images in the first row when viewed on computers. On tablets, images [1] and [2] sit side by side and the text description slides down to the next row.
On mobile phones, all the items are full width and the text block positions itself vertically between the two images that it describes.
This is the text content to describe images [3] and [5]. It is positioned between the two images in the second row when viewed on computers.
On tablets, images [3] and [4] sit side by side and the text description slides down to the next row.
On mobile phones, all the items are full width and the text block positions itself vertically between the two images that it describes.
This example use the background image option in the wrapper.
The background image doesn't have to have top quality as it is mostly cover and disappears on tablets and phones to be replaced by the selected background color.
Vertical alignment of items in a CSS grid module layout uses the "align-self" property.
The options are "start" which aligns the item at the top, "center" for center align and "end" to align it at the bottom of the row. The "auto" value stretches the item to fill the row vertically.
