Grid Traditional Columns and Rows
  1. Use a parent grid to create rows, each item span for 12 columns.
  2. Inside each item of the parent grid, pass a child grid to create columns.
Demo
Item
Item
Item
Item
Item
Item
Twig
{% set row %}
  {% include '@bolt-layouts-grid/grid.twig' with {
    items: [
      {
        column_start: '1',
        column_span: '4',
        content: item,
      },
      {
        column_start: '5',
        column_span: '4',
        content: item,
      },
      {
        column_start: '9',
        column_span: '4',
        content: item,
      },
    ]
  } only %}
{% endset %}

{% include '@bolt-layouts-grid/grid.twig' with {
  items: [
    {
      column_start: '1',
      column_span: '12',
      row_start: '1',
      row_span: '1',
      content: row,
    },
    {
      column_start: '1',
      column_span: '12',
      row_start: '2',
      row_span: '1',
      content: row,
    }
  ]
} only %}
HTML
<bolt-grid>
  <bolt-grid-item row-start="1" row-span="1" column-start="1" column-span="12">
    <bolt-grid>
      <bolt-grid-item column-start="1" column-span="4">
        <!-- Item Content -->
      </bolt-grid-item>
      <bolt-grid-item column-start="5" column-span="4">
        <!-- Item Content -->
      </bolt-grid-item>
      <bolt-grid-item column-start="9" column-span="4">
        <!-- Item Content -->
      </bolt-grid-item>
    </bolt-grid>
  </bolt-grid-item>
  <bolt-grid-item row-start="2" row-span="1" column-start="1" column-span="12">
    <bolt-grid>
      <bolt-grid-item column-start="1" column-span="4">
        <!-- Item Content -->
      </bolt-grid-item>
      <bolt-grid-item column-start="5" column-span="4">
        <!-- Item Content -->
      </bolt-grid-item>
      <bolt-grid-item column-start="9" column-span="4">
        <!-- Item Content -->
      </bolt-grid-item>
    </bolt-grid>
  </bolt-grid-item>
</bolt-grid>