Welcome to the Treehouse Community
Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.
Looking to learn something new?
Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.
Start your free trialMacmillan Makore
10,167 PointsNext, use the & symbol to create the selector .icn-success. Set the color of .icn-success to green.
I need some help here. Im in a cloud of confusion
.banner {
.button{
font-size:1.5em;}
padding: 1em;
background-color: lightgrey;
}
.icn{
font-size:1.25em
}
&:.icn-success {
color: green;
}
.icn-success-warning {
color: red;
}
2 Answers
Unsubscribed User
8,900 PointsHello Macmillan,
Double check the new selector you are trying to create. First, the location of your new selector is in the wrong place. You will want to make sure to place this modifier class inside of the main class. Second, make sure to check the way you are naming you this new modifier class as you currently have more information included than is needed in SCSS.
For example:
Say I have these classes, .example
and .example-color
,
Using SCSS you will want to modify your code to look something like this
.example {
&-color {}
}
Check out some additional examples here!
Hope this helps, Good luck!
Matt R.
Macmillan Makore
10,167 PointsThanks mate. I finally grasped it from your explanation. Genius answer
Unsubscribed User
8,900 PointsGreat! I'm glad you got it working. Good luck with the rest of the course!
Macmillan Makore
10,167 PointsMacmillan Makore
10,167 PointsHey Matt. Thanks for the help hey. I hope im not a bother. One more question, i have tried what you gave me and it gave this bummer!! Bummer! Make sure you're using a nested selector and an '&' to define '.icn-success'.
Unsubscribed User
8,900 PointsUnsubscribed User
8,900 PointsHey, not a problem!
Did you make sure to move that selector within the main
.icn
class? In your example, you have placed it outside of the main class. It should come directly after the font-size of.icn
. Make sense? Also, before you were using&:.icn-success
You'll want to make sure you are only using&-success
and to remove the:.icn
If you have any more questions or issues just let me know!
Good luck! Matt R.