3.4.1 x3 View in a new window

Three tile wide grid.

Twig: layout/flex-tile/flex-tile-3x.twig

Example
1
2
3
4
5
6
7
8
9
10
11
Markup 
{% set classes = classes|default(['flex-tile', 'flex-tile--3x']) %}

<div class="grid__container">
  <div {{ attributes|join(' ') }} class="{{ classes|join(' ') }}">
    {% block content %}
      <div class="flex-tile__item flex-tile--push-1x">
        <div class="flex-tile__inner">1</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">2</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">3</div>
      </div>
      <div class="flex-tile__item flex-tile--span-2x">
        <div class="flex-tile__inner">4</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">5</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">6</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">7</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">8</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">9</div>
      </div>
      <div class="flex-tile__item">
        <div class="flex-tile__inner">10</div>
      </div>
      <div class="flex-tile__item flex-tile--span-3x">
        <div class="flex-tile__inner">11</div>
      </div>
    {% endblock %}
  </div>
</div>