LESS Parent Selector

SASS or LESS are preprocessors and allow you a lot of features, like compiling your CSS, so you have minimized CSS at the end. But here we have much more options than just compiling the code, we can write in OOCSS, so Object Oriented in CSS. If you already use OOP in other languages you will like it here as well and as soon as you get used to it, maybe you will forget about CSS :)

Of course, this also works in LESS with the possibilities that LESS offers us and fulfills its purpose. We also create a variable here and use it in masked (escaped) state.

In LESS you will not find as many examples as in SASS because the parent is more common there than in LESS. However, LESS can actually do everything SASS can, if you know a good difference, please fill in with your comment.

 0  .block .block__elem {  1      width: 100%;  2  }  3    4  .block .block__elem .block__something {   5      background-color: #fff;  6  }  7    8  . block .block__elem .block--something  {   9      background-color: #0ff;  10  } 

Now we have done exactly the same thing as in SASS and can address our parent as often as we want.

 LESS parent

And if you think now great I prefer to use SASS, there is this possibility also, but a little different but almost the same principle, so check this:  SASS address parent