Search code examples
reactjsreact-css-modules

Multiple React component className's

We have a React project where styles are written like this:

import styles from 'styles/sidebar.module.scss'
...
<div className={styles.sidebar}>Hello</div>

I can't figure how to include two classes with this syntax, e.g.:

<div className={styles.sidebar}+{styles.scroll}>Hello</div>
<div className={styles.sidebar, styles.scroll}>Hello</div>
<div className={styles.sidebar}, {styles.scroll}>Hello</div>
<div className={styles.sidebar}{styles.scroll}>Hello</div>

Nothing from the above works, what else can I try?

Solution

  • just like this, because they are just strings:

    <div className={`${styles.sidebar} ${styles.scroll}`}>Hello</div>