44

How do I represent a direct descendent CSS rule in SASS?

Ex.

body > div { ... }

Couldn't seem to find it in the docs: http://sass-lang.com/docs/yardoc/file.SASS_REFERENCE.html

neezer
  • 19,720
  • 33
  • 121
  • 220
  • possible duplicate of [Sass and combined child selector](http://stackoverflow.com/questions/7345763/sass-and-combined-child-selector) – Vivek Feb 25 '15 at 06:48

1 Answers1

72

You should just be able to

body
  >div
    property:value

You may have to escape the > with a backslash \.

Ryan Joy
  • 3,021
  • 19
  • 20
  • 13
    Note: no space between `>` and `div`. I thought sass couldn't do this for so long because I like whitespace. – jchook Jan 01 '13 at 16:14
  • 7
    I always did `& > div`, but I didn't like it because it looked too messy. This is a lot cleaner, though not perfect, but that's not your fault, of course. Thanks! – Friend of Kim Jul 11 '13 at 12:09
  • 5
    i think this should be more visible somewhere in the documentation – Riki137 Mar 24 '15 at 11:51
  • 1
    I'm trying it with whitespace and it seems to work (though I am doing it through codeacademy's UI). Like this: ` > .nested_class ` – munchschair Jul 09 '16 at 00:36