We're currently working on the future of the Design system at Co-op

We'll start talking about this publicly as soon as we can. In the meantime this site will remain up to date with our current design patterns.

Offsetting columns live

Columns can be offset by a specified amount of columns from the left hand side.

Example

Example

HTML

                                
<div class="coop-l-grid">
    <div class="coop-l-grid__item coop-l-grid__item--6 coop-l-grid__item--offset-1 coop-l-grid__item--small-offset-2 coop-l-grid__item--medium-offset-3 coop-l-grid__item--large-offset-4">
        <span class="ds-demo-block"></span>
    </div>
</div>