Sass Invalid CSS Error: "expected expression"

Question

I've just been following the Sass tutorial. For some reason though the Sass file is not correctly generating the css. The terminal says the css is invalid but I'm pretty sure it's not. I've tried changing it too just in case there was a problem...

What have I done wrong?

Sass Version: Sass 3.1.10

Error message:

error sass/test.sass (Line 3: Invalid CSS after "80%": 
expected expression (e.g. 1px, bold), was ";")

.sass file contents:

/* style.scss */
#navbar {
  width: 80%;
  height: 23px;
}

Ahaaa! The problem was caused by using the wrong file extension! It's **.scss** not **.sass** — Tom R, Oct 12 '11 at 20:16

user229044 · Accepted Answer · 2012-03-12T19:05:11.053

157

Based on your error message (error sass/test.sass) I can tell you're using the .sass extension for a Scss file. Change your file name to style.scss.

Sass and Scss use two different and incompatible syntaxes.

edited Mar 12 '12 at 19:05

answered Oct 12 '11 at 20:16

user229044

232,980
40
330
338

score 12 · Answer 2 · edited Sep 01 '21 at 16:39

12

Try either:

/* style.scss */
#navbar {
  width: 80%;
  height: 23px;
}

Or:

/* style.sass */
#navbar 
  width: 80%
  height: 23px

Note the difference in file extension and syntax.

edited Sep 01 '21 at 16:39

Omega

2,998
2
16
19

answered Aug 18 '14 at 13:53

lincolnge

1,037
14
19

Sass Invalid CSS Error: "expected expression"

2 Answers2

Linked

Related