Search code examples
cssreactjsreact-css-modules

# Id selector in react css modules

I'm using React Css modules for styling my react app.

I have some html elements with id attribute and I want to style them using the css id selector and not a class selector. Is that possible with react css modules? For example.

This is an example of css, I'm going to call it Button.modules.css

#specialButon {
 margin: 5px;
}

.notSpecialButton {
 margin: 5px;
}

And this is an example of react component

import style from './Button.module.css';

function Button() {

 render(
  <div>
   <button id="specialButon">Special<button>
   <button className={style.notSpecialButton}>Not Special<button>
  </div>
)

export default Button

Could you tell me, How can I use de id selector to apply style elements?

Thanks you.

Solution

  • For that, you can use global CSS in React which is generally in App.js. But is general to use className in module CSS.