What does the '&' selector select?

Question

In this codepen there is a css selector &:hover what does that selector match?

Answer 1

Exactly. In Sass you could have something like this...

 div {
    background: green;

    p {
        background: red;

        &:hover {
            background: blue;
        }

        &:active {
           background: blue; 
        }
    }   
}

...which when converted to CSS would become this:

div {
    background: green;
}

div p {
    background: red;
}

div p:hover {
    background: blue;
}

div p:active {
    blue;
}

Edit: from &hover: to &:hover