Full width cells with modifiers

[Jeremy Worboys]

Thanks for this excellent solution to fluid grids. I am implementing it in my current project and came across the need for full width cells. I have modified the code for my own use but thought it would be helpful to share my thoughts for future users.

My changes were on line 60 of _grid-helpers.scss:

$x: $n;
@if ($modifier == '') {
    $x: $n - 1;
}

This allowed me to do:

<div class="grid">
    <div class="grid__cell unit-1-2--narrow unit-2-2--medium unit-1-4--max">
        content intro
    </div>
    <div class="grid__cell unit-1-2--narrow unit-1-3--medium unit-1-4--max">
        content
    </div>
    <div class="grid__cell unit-1-2--narrow unit-1-3--medium unit-1-4--max">
        content
    </div>
    <div class="grid__cell unit-1-2--narrow unit-1-3--medium unit-1-4--max">
        content
    </div>
</div>

There may be another way to do this without the code modification that I couldn't figure out. I would like to hear your thoughts.