Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS Sass Basics Improve Your Workflow with Sass Nested Selectors

Amandeep Pasricha
Amandeep Pasricha
14,932 Points

Does this count as repeated code?

Hi,

I'm working on and project 4 and was wondering if targetting the <a> element in different places, but with different properties under it, counts as repeated code?

https://ibb.co/Gdt0mbq

1 Answer

Hello

That is not repeated code as the links are targeted depending on different specificity.

When the SCSS is compiled to CSS it will stay have the same rules apply (top to bottom) so your first anchor tag is generic and should always be at the top. More specific ones, i.e. your nav anchors should be below the generic one like you have done there.

I can see you are following the BEM methodology so for me i would actually change the anchor to a named class.

For example:

.nav {
    list-style-type: none;
    padding: 0;
    text-align: center;

    &__item {
        display: block;
        color: inherit;
        padding: 8px 15px;

        &:hover {
            background-color: green; 
        }
    }

    &__link {
        display: block;
        color: inherit;
        padding: 8px 15px;
    }
}

This not only makes your code more flexible, it also keeps your specificity low, which is the whole reason for following a methodology like BEM.