# React-Hubspot form

**URL:** <https://community.hubspot.com/t/react-hubspot-form/57054>\
**Category:** APIs & Integrations\
**Tags:** professional\
**Created:** [May 16, 2022, 7:14pm UTC](https://community.hubspot.com/t/react-hubspot-form/57054 "2022-05-16T19:14:40Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![MP9](https://avatars.discourse-cdn.com/v4/letter/m/bbe5ce/32.png) [@MP9](https://community.hubspot.com/u/MP9)\
**Post date:** [May 16, 2022, 7:14pm UTC](https://community.hubspot.com/t/react-hubspot-form/57054/1 "2022-05-16T19:14:40Z")

</div>

In the react-Hubspot-form we have given cssClass with a particular name and also added a CSS attribute with an empty string it is working correctly but the email id is not submitted. In terms of how to add the custom class name to React-Hubspot form .

---

<div class="post-metadata">

**Author:** ![dennisedson](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/dennisedson/32/28044_2.png) [@dennisedson](https://community.hubspot.com/u/dennisedson)\
**Post date:** [May 17, 2022, 1:46pm UTC](https://community.hubspot.com/t/react-hubspot-form/57054/2 "2022-05-17T13:46:48Z")

</div>

@MP9 ,

Could you add the code you are working with?

@piersg , @Teun have either of you used this react component?

---

<div class="post-metadata">

**Author:** ![MP9](https://avatars.discourse-cdn.com/v4/letter/m/bbe5ce/32.png) [@MP9](https://community.hubspot.com/u/MP9)\
**Post date:** [May 17, 2022, 2:53pm UTC](https://community.hubspot.com/t/react-hubspot-form/57054/3 "2022-05-17T14:53:41Z")

</div>

Hi,  
Here is the code and used the “react-Hubspot-form” library if I give the css with an empty string only I can overwrite the CSS if I do that the email button is not working.  
\<HubspotForm  
portalId=“portalId”  
region=“region”  
formId=“formId”  
cssClass=“hub-spot-form”  
submitButtonClass=“submit-btn-new”

css=“”  
/\>  
Thank you.

---

<div class="post-metadata">

**Author:** ![piersg](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/piersg/32/99782_2.png) [@piersg](https://community.hubspot.com/u/piersg)\
**Post date:** [May 19, 2022, 8:38am UTC](https://community.hubspot.com/t/react-hubspot-form/57054/4 "2022-05-19T08:38:54Z")

</div>

What happens if you don’t include the css property in the form component? e.g.

```lia-code-sample
<HubspotForm
portalId="portalId"
region="region"
formId="formId"
cssClass="hub-spot-form"
submitButtonClass="submit-btn-new"
/>

```

---

<div class="post-metadata">

**Author:** ![MP9](https://avatars.discourse-cdn.com/v4/letter/m/bbe5ce/32.png) [@MP9](https://community.hubspot.com/u/MP9)\
**Post date:** [May 19, 2022, 8:48am UTC](https://community.hubspot.com/t/react-hubspot-form/57054/5 "2022-05-19T08:48:14Z")

</div>

If am not CSS property means the class name we are giving is not added if I give the with empty string means the class name is working but the submit button is not working.

---

<div class="post-metadata">

**Author:** ![piersg](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/piersg/32/99782_2.png) [@piersg](https://community.hubspot.com/u/piersg)\
**Post date:** [May 20, 2022, 7:37am UTC](https://community.hubspot.com/t/react-hubspot-form/57054/6 "2022-05-20T07:37:46Z")

</div>

When you say the submit button is not working, do you mean the css for the submit button isn’t working, or do you mean the button itself doesn’t work i.e. isn’t submitting the form?

If you mean the former, you could target the button as a child of the form in css, instead of directly. I’m not sure where the form css class is applied but you could also do it as a child of that.

```lia-code-sample
form input[type=submit] {

}
/* or */
.hub-spot-form input[type=submit] {

}

```

---

<div class="post-metadata">

**Author:** ![Teun](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/teun/32/28739_2.png) [@Teun](https://community.hubspot.com/u/Teun)\
**Post date:** [May 18, 2022, 7:28am UTC](https://community.hubspot.com/t/react-hubspot-form/57054/7 "2022-05-18T07:28:00Z")

</div>

Hi @dennisedson ,

I did not have the chance to work with this module yet.