I'm new to SASS and I'm trying to create a simple for loop in SASS for create grid classes. I have five boxes in my grid. Basically this is what I'm trying to do for each box:
.box1 {
grid-area: box1;
width: 100%;
img {
width: 100%;
}
}
And this is my SASS code:
$gridBox: 5;
@for $i from 1 through $gridBox {
.box#{$i} {
grid-area: box + $i;
width: 100%;
img {
width: 100%;
}
}
}
I checked main.css file and SASS automatically adds -ms-grid-row and -ms-grid-column to box classes. Because there is no grid-row and grid-column VS Code gives an error and wants me to also define standard properties but I'dont want to add them. How can I solve this problem?