Grid column start and column span The Bolt Grid is built on the concept of column start and column span, this allows the user to have full control of the grid layout.
Important Notes:

Please refer to the Bolt Breakpoints for all possible breakpoint names. number@breakpoint-name means starting at that specific breakpoint, change to the number defined. For example: column-span="6@small" means starting at the small breakpoint, span 6 columns.

Demo
Aside
Main
Aside
Twig
{% include '@bolt-layouts-grid/grid.twig' with {
  items: [
    {
      column_start: '1',
      column_span: '2',
      content: item_aside,
    },
    {
      column_start: '3',
      column_span: '8',
      content: item_main,
    },
    {
      column_start: '11',
      column_span: '2',
      content: item_aside,
    },
  ]
} only %}
HTML
<bolt-grid>
  <bolt-grid-item column-start="1" column-span="2">
    <!-- Aside Content -->
  </bolt-grid-item>
  <bolt-grid-item column-start="3" column-span="8">
    <!-- Main Content -->
  </bolt-grid-item>
  <bolt-grid-item column-start="11" column-span="2">
    <!-- Aside Content -->
  </bolt-grid-item>
</bolt-grid>