Sass

bug.css

@charset "UTF-8";
small:before {
  content: "— "; }

.page-content {
  margin: 44 px 0 0 0; }

bug.scss

$toolbar-height: 44;

small:before {
    content: "— ";
}

.page-content {
    margin: #{$toolbar-height}px 0 0 0;
}

Try this instead: margin: $toolbar-height + px 0 0 0;

Or, add px to the var like so $toolbar-height: 44px; and that will become margin: $toolbar-height 0 0 0;

Notice that you don't need to interpolate, not in this case.

Thanks for the feedback, both of those work perfectly. I was planning to switch to using px in the variable, but thought it was a good idea to point out a potential bug in the compiler before moving on in silence.