p_duthoit
p_duthoit

Reputation: 328

Sass compiling and transforming special characters

I'm having an issue when my Sass compiles my .scss file. It seems that Sass compiles the « special characters and transform it in another one ┬½. But I want to keep my « in my .css file.

Does anybody know how to fix this? Or maybe who knows how to ask Sass not to compile specific lines?

Here's my scss code:

/* SCSS file sample */
&::before{
    content: "«";
}

&::after{
    content: "»";
}

And here's how it compiles it:

/* Compiled CSS */
.textBox--quotation::before {
  content: "«";
}
.textBox--quotation::after {
  content: "┬╗";
}

Thank you for your help.

Upvotes: 2

Views: 2047

Answers (3)

mrmoree
mrmoree

Reputation: 402

I ran into the same charset problem.

Especially on OSX there seams to be a problem with ruby Encoding Settings.

I fixed it creating a config.rb file in the main project directory to tell ruby explicitly which charset encoding it should use. Since sass and compass depend on ruby, chances good that this might fix your problems.

Encoding.default_external = 'utf-8'

Upvotes: 0

Fabian N.
Fabian N.

Reputation: 1240

I can confirm this under Windows Sass 3.5.1 (Bleeding Edge).

When the file is encoded as UTF-8 with BOM this does not happen. Only when the file is encoded without BOM (which basically means, you encode UTF-8, but you are not telling anyone). My guess: Sass will parse the file as plain ANSI and thus sees these 2 characters.

Funny thing: When the file was encoded with BOM, sass removes it and adds an annotation @charset "UTF-8"; Never mind, it always does this

Upvotes: 2

roberrrt-s
roberrrt-s

Reputation: 8210

Use the CSS equivalent of your special character:

\00AB (As converted here)

div:after {
  content: "\00AB";
}
<div>hello  </div>

Upvotes: 4

Related Questions