views:

253

answers:

1

Hi guys, I have the following mixin in a sass partial:

=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

Now, when I tried to make it parameterized and added some vars, they keep being ignored:

=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

I'm using it like this:

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

The problem is that when I use the parameterized version of my mixin, the width property is ignored, it doesn't even appear in the CSS. Can you spot any errors on this code?

If I use the NOT parameterized version of the mixin, everything works fine.

+1  A: 

If you're using a variable in a property, you need to use =, not :.

=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
nex3
It worked! thanks a lot, I was going crazy! :D
lobo_tuerto
No problem. In future versions of Sass, I plan to get rid of the need for `=` and just let people use `:` with variables.
nex3