Use @each to Map Over Items in a List (need step by step direction)

[lasjorg]

Please do not create duplicate threads. I will close this in favor of the other.

Use @each to Map Over Items in a List (getting it wrong)

Tell us what’s happening: **Your code so far** <style type='text/sass'> $colors:(color1:blue,color2: black,color3: red); @each $key, $color in $colors { .#{$color}-bg {background-color:$color}; } div { height: 200px; width: 200px; } </style> <div class="blue-bg"></div> <div class="black-bg"></div> <div class="red-bg"></div> **Your browser information:** User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/89.0.4389.114 Safari/537.…

Which BTW already has an answer to what the problem is. You changed the type value on the style element, it should be scss not sass.