0

Well, I have a problem with Sass function lighten(), this is my code:

@for $i from 1 through 4{
    .par-#{$i}{
        background: lighten(#08725D, #{$i}0%);
        padding: 10px;
        border-radius: 5px;
    }
}

I think it's pretty obvious what I want to do, I just want to go through that variable and increment the lightening of the bg color (while I increment the number in the class), but I have this error in console:

error main.scss (Line 111: $amount: "10%" is not a number for `lighten')

I need help please.

1

1 Answer 1

2

$i contains a number. Keep using it as a number instead of using concatenation :

@for $i from 1 through 4{
    .par-#{$i}{
        background: lighten(#08725D, $i * 10);
        padding: 10px;
        border-radius: 5px;
    }
}
1
  • I don't even know how I didn't realize it... I'm a bit sleepy so XD but It works perfectly fine. Thank you. Oct 14, 2014 at 12:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.