CSS Sass Basics Improve Your Workflow with Sass Write Nested Selectors

Nikki Turrisi
Nikki Turrisi
14,233 Points

Challenge Task 3 of 4, ampersand for nested selector.

Hi!

I am stuck, I don't know the correct answer for this quiz question.

style.scss
.banner {
  padding: 1em;
  background-color: lightgrey;
    .button {
        font-size: 1.5em;
    }
}

.icn {
    font-size: 1.25em;
    &.icn-success {
        color: green;
    }

2 Answers

Martin Jones
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
Martin Jones
Front End Web Development Techdegree Graduate 41,157 Points

Hi Nikki,

Very close, the & symbol will copy the name of the parent class, so you don't need the icn- prefix in this case.

.banner {
  padding: 1em;
  background-color: lightgrey;
    .button {
        font-size: 1.5em;
    }
}

.icn {
    font-size: 1.25em;
    &-success {
        color: green;
    }
}

Hope this helps

Nikki Turrisi
Nikki Turrisi
14,233 Points

Thanks, Martin! I figured it out shortly after but definitely appreciate the help :)