sass - Adding units to font-size and line-height variables in font shorthand -

i try learn sass. in order compile files, use prepros app. worked until started use mixins. code follows:

@mixin fontface($size) {     font: ($size)px/($size*1.7)px "roboto slab", georgia, sans-serif; }

and use this:

@include fontface(28);

when compile it, got spaces added variables, this:

font: 28 px/47.6 px "roboto slab", georgia, sans-serif;

how can change it? because app, or doing wrong?

the correct way add unit via multiplication. however, need turn 1 of values string in order prevent division in shorthand:

@mixin fontface($size) {     font: #{$size * 1px}/#{$size * 1.7px} "roboto slab", georgia, sans-serif; }

instead, may want apply unit before passing mixin:

@mixin fontface($size) {     font: #{$size}/#{$size * 1.7} "roboto slab", georgia, sans-serif; }  .foo {   @include fontface(10px); }

or use unitless line-height:

@mixin fontface($size) {     font: #{$size}/1.7 "roboto slab", georgia, sans-serif; }  .foo {   @include fontface(10px); }

Copy