user11582989
user11582989

Reputation:

Why won't the symbol "&" work within my scss code?

Hey I've just started on building a website for my portfolio but i instantly ran into a problem. I've never worked with Sass before, only basic css so i don't know all the quirks and tricks. But i watched a video to learn more about it and to learn more about creating my responsive website. I came to using the symbol "&" in the context of changing some elements on a navigation-bar. The code is as follows:

header {

    nav {
        padding: 40px;   
     
    }        
    &__links {

        a {   
            font-size: $font-sm;
        
        }  
    }
    a:hover {
        color: $darkblue;

    }

}

The "a:hover" and "nav" works perfectly but the "&__links" and everything inside it doesn't work. The file that this code is located in is linked to a main "Style.css" page by using the "import" function, Which in turn is linked to the main html Index page via this command: "". I appreciate any help I can get concerning my problem here and I can send more code if needed. But i believe this is the only code needed as i have tried to isolate the problem. Thanks :)

Upvotes: 0

Views: 414

Answers (1)

Quentin
Quentin

Reputation: 943996

The & does work. It generates something that looks like this:

header__links a {
  font-size: 10px;
}

There is no <header_links> element allowed in HTML though.

Likely you wanted to generate a different selector entirely.

Upvotes: 2

Related Questions