Что случилось с элементом формы?

Question

[Zhanna_K]

Делаю карточку. Вот это компонент

import React from "react";
import styles from "./searchCard.module.scss";
import Textfield from "../../Textfield/Textfield";
import SubmitButton from "../../Button/Submit/SubmitButton";
const SearchCard = () => {
  return (
    <div className={styles.card__wrapper}>
      <h1 className={styles.card__title}>Найдём номера под ваши пожелания</h1>
      <form сlassName={styles.card__form}>
        <Textfield role='dropdown' size='sm' placeholder='ДД.ММ.ГГГГ' />
        <Textfield role='dropdown' size='sm' placeholder='ДД.ММ.ГГГГ' />
        <Textfield role='dropdown' size='lg' placeholder='Сколько гостей' />
        <SubmitButton
          size='Xlarge'
          selector='contained'
          text='Подобрать номер'
        />
      </form>
    </div>
  );
};

export default SearchCard;

В итоге вижу, что стили к элементу FORM не применились, ко всем остальным применяются.
Вот что я вижу в ChromeDevtools

Вопрос? Почему там classname когда у всех остальных элементов нормальные классы?

Comments

[Zhanna_K]

Пару раз переписала одно и то же, и в какой-то момент всё заработало...

[Robur]

Zhanna_K, просто так ничего не начинает работать, что то вы поменяли все таки.
пальцем в небо - у вас было classname вместо className

[Zhanna_K]

Robur, нет! конечно, в первую очередь приходит в голову, что это опечатка, НО всё было было написано как в коде выше! и я ничего не меняла.