Remove space between element and class

Question

I have the following:

div {
   .demo {
      color: #000;
   }
}

Which Outputs:

div .demo { color: #000; }

However, I need it to output without the space between the element and the class:

div.demo { color: #000; }

Is there any way to do this using SASS Nesting?

Ry- · Accepted Answer · 2014-07-08T17:20:16.937

4

div {
   &.demo {
      color: #000;
   }
}

edited Jul 08 '14 at 17:20

answered Jul 08 '14 at 16:48

Ry-

Thanks, I'm still learning how to navigate their documentation. It's oddly structured. – Blanky Jul 08 '14 at 17:09

score 2 · Answer 2 · answered Jul 08 '14 at 16:50

2

You can use the ampersand in front of .demo to achieve this.

div {
   &.demo {
       color: #000;
   }
}

The ampersand character is a placeholder for whatever the parent element is.

answered Jul 08 '14 at 16:50

2 Answers2