title: How can I use @for in sass to assign background positions to multiple classes
body: <p>Ok so here's my code:</p>
  
  <pre><code>.file-icon,.folder-icon{
        $size:24px;
        position: absolute;
        top: 10px;
        left: 44px;
        display: block;
        float: left;
        width: $size;
        height: $size;
        margin-right: 10px;
        background: $driveIcon;
  
        &amp;.folder-close{
          background-position: 0 -72px;
          &amp;.folder-open{
            background-position: -$size -72px;
          }
        }
  
        &amp;.archiveIcon{
          background-position: -$size*2 -72px;
        }
        &amp;.audioIcon{
          background-position: -$size*3 -72px;
        }
        &amp;.brokenIcon{
          background-position: -$size*4 -72px;
        }
        &amp;.docIcon{
          background-position: -$size*5 -72px;
        }
        &amp;.imgfile{
          background-position: -$size*6 -72px;
        }
        &amp;.pdfIcon{
          background-position: -$size*7 -72px;
        }
        &amp;.pptx{
          background-position: -$size*8 -72px;
        }
        &amp;.txtIcon{
          background-position: -$size*9 -72px;
        }
        &amp;.unknown{
          background-position: -$size*10 -72px;
        }
        &amp;.videoIcon{
          background-position: -$size*11 -72px;
        }
        &amp;.xlsIcon{
          background-position: -$size*12 -72px;
        }
        &amp;.viewer{
          background-position: -$size*13 -72px;
          &amp;.folder-open{
            background-position: -$size*14 -72px;
          }
        }
        &amp;.owner{
          background-position: -$size*15 -72px;
          &amp;.folder-open{
            background-position: -$size*16 -72px;
          }
        }
        &amp;.moderator{
          background-position: -$size*17 -72px;
          &amp;.folder-open{
            background-position: -$size*18 -72px;
          }
        }
      }
  </code></pre>
  
  <p>What I want to do is automate this assigning of background positioning. I tried using @for for the actual statement but not able to figure out how to assign the results one by one to my custom second classes. Please help me out, i'm a beginner in sass. Thankyou.</p>
  
  <p>This is what I've done up till now:</p>
  
  <pre><code>@for $i from 0 to 18{ background-position: -($size*$i} -72px; }
  </code></pre>