How to get first child to work with JSS-Nested

Question

I am using the jss preset default and it comes with jss-nested.

I could get '&:hover' to work but '&:first-child' does not work for me.

sample code:

    summaryItem: {
    borderLeft: '2px solid red',
    '&:first-child': {
        borderLeft: '2px solid transparent',
      }
    }

score 10 · Answer 1 · answered Sep 24 '18 at 10:35

You need to add a space for calling child selectors else it would be like calling div:first-child instead of div > :first-child

    summaryItem: {
    borderLeft: '2px solid red',
    '& > :first-child': {
        borderLeft: '2px solid transparent',
      }
    }

1 Answers1