Formation SASS, question sur les boucles

Merci pour cette formation qui jusque là s'est passée sans accrocs.
Mais je viens de rencontrer un soucis avec les boucles.
J'ai repris à l'identique l'exemple des .grid , mais au final Chrome ne tient pas comptes des width calculées par la boucle for.
En mode debug, le style sur .grid4 (par exemple) est barré, il semble hériter d'une autre valeur... mais laquelle ?!
Si vous avez une idée... je suis preneur, merci !

le html

<div class="grid4">
        Mon contenu 4
    </div>
    <div class="grid4">
        Mon contenu 4
    </div>
    <div class="grid8">
        Mon contenu 8
</div>

le scss

$columns: 16;
$width: 100%;
$marge: 1%;
.grid {
    background-color: #e9e9e9;
    float: left;
    margin: 0 $marge;
}
@for $i from 1 to $columns + 1 {
    .grid#{$i} {
        @extend .grid;
        width: $i * $width / $columns -2 * $marge;
    }
}