MNIEJ CSS: nadużywanie & Operator podczas zagnieżdżania?

Mniej używa& Operator, aby poprawićmożliwości zagnieżdżania.

.header        { color: black;
  .navigation  { font-size: 12px;
    &.class    { text-decoration: none }
  }
}

co powoduje zastąpienie& z selektorem nadrzędnym i skutkuje konkatenacją rzeczywistego prawa selektora do selektora nadrzędnego:.header .navigation.class zamiast normalnego dopisywania, które skutkowałoby.class będąc decendantem:.header .navigation .class.

Teraz możliwe jest również następujące (patrz także tutaj):

.header        { color: black;
  .navigation  { font-size: 12px;
    #some-id & .foo   { text-decoration: none }
  }
}

co spowodowałoby:#some-id .header .navigation .foo spróbuj tutaj . Podstacja ma miejsce i mampoprzedzony selektor (#some-id) do mojego selektora rodzica.

Poza faktem, że nigdy nie kodowałbym tego w ten sposób, ponieważ prawdopodobnie to szybko zakłóci twój arkusz stylów, moje pytanie:

Ponieważ ta funkcja nie jest udokumentowana, czy jest to funkcja, czy raczej błąd?
Jakie są możliwe skutki uboczne?

questionAnswers(2)

yourAnswerToTheQuestion