Grow your CSS skills. Land your dream job.

SASS @mixin urgent

  • # February 14, 2013 at 9:43 am

    Hi.
    1) With .scss i wrote this:
    @mixin radius($radius1,$radius2){
    **border-radius: $radius1 $radius2 / $radius2 $radius1;**
    }

    But here, “/” forward slash is accepted as Dividing sign i guess. If i say
    **@include radius (30px,20px),**
    i get in CSS
    **border-radius: 30px 1 30px;**
    How to solve it?

    2)Again, in SASS
    @mixin translate($type, $value){
    transform: $type($value);
    -moz-transform: $type($value);
    }

    . I use
    @include translate(rotate,30deg)
    But it compiles to CSS as like this :
    transform: rotate 30deg;
    Parantheses disappear ?

    # February 14, 2013 at 10:30 am

    First one is solved, i should use “border-radius: #{$radius1} #{$radius2} / #{$radius2} #{$radius1};

    What about second?

    # February 14, 2013 at 10:31 am

    LOL at thread title!

    Urgent CSS :)

    # February 14, 2013 at 10:43 am

    OK, i solved second two :D I should use
    @mixin translate($me){
    transform: $me;
    }

    And call it as like :
    @include translate(rotate(30deg));

    Thanx for reading ;)

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".