sass: Unicode glyph not being compiled properly

I’m using Sass version 3.2.4.

I have this Sass:

/* A better looking horizontal rule */
hr {
    @extend %mrg-on;
    color: $color-grey-lighter;
    border: 0;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    position: relative;
    /* Pesudo element for a more stylised `hr` */
    &:after {
        content: "§";
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        line-height: 0;
        text-align: center;
    }
}

Notice the Unicode glyph in the :after content value, it’s being compiled too:

content: "┬º";

When I’m using the actual code for Unicode characters e.g. content: "\201D"; then no problem.

About this issue

Original URL
State: closed
Created 11 years ago
Comments: 20 (8 by maintainers)

Most upvoted comments

I’m going to guess that your system encoding is not set to the same encoding that you’re using in your file. Sass (or more accurately Ruby) reads the system encoding information to determine what default encoding to use when reading files, and if the encoding that your system lists as the default isn’t the same as the encoding the file actually uses you’ll get weird errors like this.

There are various OS-specific ways of configuring your system encoding, but a more robust solution would probably be to add @charset "utf-8"; at the top of your SCSS file.

nex3 on Jan 8, 2013