Is there a reason why SASS, a CSS generator, needs to reject lines such as margin:10px ? (no space after colon)

Question

I need to change all the CSS into SASS... and find that

margin:10px

working in CSS and failing in SASS somewhat disturbing...

It is easy to miss one and you don't what you are missing (what is not working in the final CSS but you don't know)

Pretty much I am grep for /:\S/ (colon by followed by a non-whitespace) to see if there are such cases, using TextMate (a Mac text editor)... but those a:hover also shows up as well.

Answer 1

In Sass you can define nested selectors, and these can have pseudoclasses such as :hover. It doesn't see your margin as an attribute but as another element with a pseudoclass.

.stylin
  display: block
  margin:10px
  a:hover
    color: red

The above will recognize display: block correctly, but it will see margin:10px and a:hover as the same kind of pattern.