Share Your Work

RElouahabi
Mitglied

form

Hey, This is my Hubspot form. Is there a way to reduce the spacing (highlighted in red) and make the form boxes and border white? Also making the email field longer than the first name field? image.png
 
0 Upvotes
2 Antworten
RElouahabi
Mitglied

form

Hi Tuen, I've added this with the CSS you provided to the HTML and still having issues.

 

Here is the link to the page: https://rachids-stupendous-site.webflow.io/landing-2

Basically,  I would like the hubspot form at the bottom of the hero section to be same as the form above it? would that be possible?

0 Upvotes
Teun
Trendsetter/-in | Diamond Partner
Trendsetter/-in | Diamond Partner

form

Hi @RElouahabi ,

 

Is your form set as a 'Raw HTML form'? That way, you can apply the styling yourself.

You could use the following CSS to increase or decrease the space between the inputs:

.hs-form .form-columns-0 .input,
.hs-form .form-columns-1 .input,
.hs-form .form-columns-2 .input {
  margin-right: 0 !important;
}
.hs-form .form-columns-2 .hs-form-field {
  width: calc(100% / 2 - 0.5rem) !important; // Change 0.5rem to increase or decrease the size
  float: left;
}
@media screen and (max-width: 620px) {
  .hs-form .form-columns-2 .hs-form-field {
    width: 100% !important;
  }
}
.hs-form .form-columns-2 .hs-form-field:last-child {
  float: right !important;
}


Learn more about HubSpot by following me on LinkedIn or YouTube

Did my answer solve your issue? Help the community by marking it as the solution.


0 Upvotes