How long are hands cut off for this way of setting class rules?

Question

Sass

Good day! Taki decided to improve his layout skills a little, it is necessary to make an adequate grid, if not a bootstrap one, then at least something remotely similar. In my understanding, everything is very simple there, that the lines are the columns, only the flex-direction is different. And I wrote the following entry in SASS (SCSS):

@for $i from 1 through 100 {
    .column-#{$i} {
        display:flex;
        flex-direction: column;
        width:percentage($number: $i / 100);
    }
}

Well, roughly speaking. I'm not sure what is worth doing directly by percentage, maybe 10, or an n-column system. Accordingly, the resulting css is proportionally increased in volume. Actually, what is the chance to be given to the holy fire of IT-quisition for such an approach? Thanks in advance!

Answer 1

In general, everything is ok.
But to reduce the final css, you can use extends

%column {
    display:flex;
    flex-direction: column;
}
@for $i from 1 through 100 {
    .column-#{$i} {
        @extend %column;
        width:percentage($number: $i / 100);
    }
}