The component disappear when i put className for CSS styling . @ionic/react

Hello ,
I have an issue which is that the component disappear when i put className .
For example < IonCard className="productCard ">
I need help with this , thank you .

Looks like the @ionic/react components all use just class. className appears only reserved for basic JSX elements

Oh , so how it can be solved then ?!
I have the same problem with CSS in JS too.

this is what seems to work for me
if you have intellisense in your IDE/editor, it helps a lot with exploring new libraries


import classes from './ProductCard.module.css';
import { IonCard } from '@ionic/react';


    <IonCard class={classes.ProductCard}>
        <!-- Card Content -->


.ProductCard {

Thank you jjdev. :kissing_heart: .But unfortunately, i don’t use css modules .

if @jjdev is correct it’s maybe like in Stencil then?

    <IonCard class="productCard">

and if you class name is contained in a string

    const myClassName = 'produceCard';
    <IonCard class={myClassName}>


I think the normal implementation should work

import './ProductCard.css';

    <IonCard class="ProductCard">