Frage

Ich habe folgendes mixin in einem sass Teil:

=card-list
  width: 180px
  min-height: 150px
  display: -moz-inline-stack
  display: inline-block
  vertical-align: top
  margin: 5px
  zoom: 1
  *display: inline
  _height: 250px
  -moz-border-radius: 10px
  -webkit-border-radius: 10px

Nun, wenn ich versuchte, es parametriert und fügte einige Vars zu machen, halten sie ignoriert werden:

=card-list(!width=180px)
  width: !width
  min-height: 150px
  display: -moz-inline-stack
  display: inline-block
  vertical-align: top
  margin: 5px
  zoom: 1
  *display: inline
  _height: 250px
  -moz-border-radius: 10px
  -webkit-border-radius: 10px

Ich verwende es wie folgt aus:

#content
  ul.characters > li
    +card-list(180px)
    background-color: black
    border: 1px solid black

Das Problem ist, dass, wenn ich die parametrisierte Version meiner mixin verwenden, wird die Breite Eigenschaft ignoriert, ist es nicht einmal in der CSS erscheinen. Können Sie haben Fehler auf diesem Code erkennen?

Wenn ich die nicht parametrisiert Version des mixin verwenden, funktioniert alles einwandfrei.

War es hilfreich?

Lösung

Wenn Sie eine Variable in einer Eigenschaft verwenden, müssen Sie = verwenden, nicht :.

=card-list($width: 180px)
  width = $width
  min-height: 150px
  display: -moz-inline-stack
  display: inline-block
  vertical-align: top
  margin: 5px
  zoom: 1
  *display: inline
  _height: 250px
  -moz-border-radius: 10px
  -webkit-border-radius: 10px
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top