CSS правила виводу SASS mixin ігноруються - sass, mixins, css-специфіка

SASS mixin, який виробляє деякі правила CSS, єігноруються. Chrome Dev Tools показує правила, зареєстровані, але закреслені, і я не можу зрозуміти, чому. Спочатку я вважав, що існує конфлікт конкретності, але немає суперечливих правил.

Ось САС:

span.icon {
display: inline-block;
background-image: url("images/sprite.png");
background-repeat: no-repeat;

&.telephone {
@include sprite("19px", "25px", "-300px 0");
}
}

Ось міксин:

@mixin sprite($width, $height, $bg-position) {
width: $width;
height: $height;
background-position: $bg-position;
}

Ось вихід з інструментів Chrome Dev Tools

Властивість ширини, висоти та фонового розміщення не вказана для цього елемента в іншому місці, тому я не розумію, чому ці правила ігноруються.

Відповіді:

Браузер ігнорує ваш CSS, оскільки він єне діє. Властивості ширини, висоти та фону-позиції не приймають рядки, вони приймають довжини (у випадку фону-позиції - список довжин).

.foo {
@include sprite(19px, 25px, -300px 0);
}

Якщо ви не хочете рядок, не використовуйте лапки.