Below is an example grid with contents to demonstrate a slightly complex grid arrangement. Here, grids are nested and configured so that the "columns" can consume different ratios of the screen at different widths. Slowly resize this page from small, phone-sized widths, to large, "desktop"-sized widths to observe how the columns reflow.

Notice that the first column's two contents are arranged as two columns in one row on small (~tablet) sized devices while the second and third columns are arranged as another row having two columns.