Less.js: :la pseudo-classe first-child ne fonctionne pas avec extend

Créé le 11 févr. 2016 · 7Commentaires · Source: less/less.js

J'utilise le code suivant :

header {
    &:extend(.menu all);
}

Dans le fichier less j'ai la structure suivante :

.menu {// CODE}
.menu:after {// CODE}
.menu:first-child {// CODE}
.menu:last-child {// CODE}

Dans le fichier de sortie, le css pour .menu et . menu: après s'afficher. Mais PAS le code pour . menu:premier-enfant ou . menu:dernier-enfant.

Si, cependant, je change. menu:premier-enfant ou . menu:dernier enfant à . menu:premier et . menu: last puis le code css s'affichera.

Il semble que le tiret soit le problème.

Une idée de comment régler ça ?

Merci.

consider closing needs info

Source

moshemo

Tous les 7 commentaires

Je ne peux pas confirmer votre résultat : démo .
D'après votre question à SO, je peux voir que vous utilisez gulp-less , mais comme je ne me souviens pas vraiment d'une version de Less (à partir de 1.4.x) qui a un bogue comme celui-ci, ce n'est probablement pas un une sorte de problème de "version moins récente ou sans gorgée". La question est: êtes - vous sûr que ce _is_ l'extrait de code que vous rencontrez le problème avec, et / ou pourrait - il être un autre (peut - être quelque chose de plus complexe?) gulp tâche qui peut interférer?

seven-phases-max le 11 févr. 2016

C'est peut-être une tâche à avaler. Je regarderai ça demain ou en début de semaine prochaine. Merci.

moshemo le 11 févr. 2016

Peut - être que

ivan-nikitovic le 13 mars 2016

😕3

Fermeture en raison de l'inactivité (ne semble pas être un problème de moins de toute façon).

seven-phases-max le 17 avr. 2016

@seven-phases-max Je pense que le code fourni ci-dessus reproduit exactement ce problème.

moins

.col {
  float: left;

  &:last-child {
    margin-right: 0;
  }
  &:first-child {
    margin-left: 0;
  }
}

.generate-columns(<strong i="9">@n</strong>, <strong i="10">@i</strong>: 1) when (<strong i="11">@i</strong> =< @n) {
  .col-@{i}:extend(.col) {
    margin-left: (@i)px;
  }

  .generate-columns(<strong i="12">@n</strong>, (<strong i="13">@i</strong> + 1));
}

.generate-columns(2);

CSS généré

.col,
.col-1,
.col-2 {
  float: left;
}
.col:last-child {
  margin-right: 0;
}
.col:first-child {
  margin-left: 0;
}
.col-1 {
  margin-left: 1 px;
}
.col-2 {
  margin-left: 2 px;
}

CSS attendu :

.col,
.col-1,
.col-2 {
  float: left;
}
.col:last-child {
  margin-right: 0;
}
.col:first-child {
  margin-left: 0;
}
.col-1 {
  margin-left: 1 px;
}
.col-1:last-child {
  margin-right: 0;
}
.col-1:first-child {
  margin-left: 0;
}
.col-2 {
  margin-left: 2 px;
}
.col-2:last-child {
  margin-right: 0;
}
.col-2:first-child {
  margin-left: 0;
}

partie manquante

.col-1:last-child {
  margin-right: 0;
}
.col-1:first-child {
  margin-left: 0;
}
.col-2:last-child {
  margin-right: 0;
}
.col-2:first-child {
  margin-left: 0;
}

ivan-nikitovic le 17 avr. 2016

@ivan-nikitovic Non, voyez la différence entre extend et extend all .

seven-phases-max le 17 avr. 2016

@seven-phases-max cela a du sens. :-) Merci pour la référence.

ivan-nikitovic le 17 avr. 2016

Cette page vous a été utile?

0 / 5 - 0 notes