less Parent selectors Changing the selector order within a nested block


Example

Less allows the usage of the parent selector (&) anywhere in a complex selector and thus allows changing styles when the current element is within another element which gives it a different context:

For example, in the below code the parent selector is placed at the end and thus it actually becomes the child's selector in the compiled CSS.

a {
  color: blue;
  .disabled-section & {
    color: grey;
  }
}

Compiled CSS:

a {
  color: blue;
}
.disabled-section a {
  color: grey;
}