There is a list whose items are links.

<ul class="list"> <li class="list-child"> <a> </a> </li> <li class="list-child"> <a> </a> </li> </ul>

In styles made nesting classes:

 .list { .child-list{} }

I thought that you can invest and anchor :

 .list { .child-list{ a{} } }

but sass swears. Can this be done, or do we need to write styles separately in such cases?

  • I don’t know about Sass, but in Less such constructions work. :) Go to Less. - Stanislav Hmelevsky
  • I tried, sass ponarvilsya more. found a way out. you can do this .child-list {> a {} - Iga

2 answers 2

Sass swears most likely due to the fact that you do not observe the indentation and confuse them with tabs.

You can write like this ( display:block - for example):

 .list{ display:block; &-child{ display:block; a{ display:block; } } }

out of it

 .list { display: block; } .list-child { display: block; } .list-child a { display: block; }

    I found the answer, I'll leave it here, maybe someone will come in handy.

     .child-list{ >a{} }