Search code examples
cssreactjsstyled-components

React Styled Components selector for self AND children?

I would like to apply a CSS style to my styled-component element as well as all its children, is there a way to do this with a single selector block? Below is what I have now, I want to accomplish the same thing without duplicating the text transition: 0.5s ease

const ImagePreviewWrapper = styled.div`
  transition: 0.5s ease;
  & * {
    transition: 0.5s ease;
  }
`
Solution

  • Just figured it out, this worked for me:

    const ImagePreviewWrapper = styled.div`
  &,
  * {
    transition: 0.5s ease;
  }