#Classname not working

1 messages · Page 1 of 1 (latest)

drowsy kiteBOT
#

Hi @ancient pier. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:

#

Based on the provided code, it seems that you are using CSS Modules with the .module.css file naming convention. Your CSS code appears to be correct, and the app__dog class should be applied to the corresponding div element.

However, if the app__dog class is not being applied as expected, you can try the following steps to debug the issue:

  1. Ensure that your CSS file is named Bar.module.css and is located in the same directory as your Bar component.
  2. Double-check that the styles object is imported correctly in your component file: import styles from './Bar.module.css'.
  3. Verify that the app__dog class is being applied to the div element using the styles object: <div className={styles.app__dog}>.

If you have followed these steps and the issue persists, it might be helpful to review the Next.js documentation on CSS Modules (https://nextjs.org/docs/basic-features/built-in-css-support#adding-component-level-css) to ensure that your setup is correct.

Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:

Basic Features: Built-in CSS Support | Next.js

Next.js supports including CSS files as Global CSS or CSS Modules, using styled-jsx for CSS-in-JS, or any other CSS-in-JS solution! Learn more here.