Lead Capture Tools

nunoautotrip
Contributor

Different field width

SOLVE

Hi everyone,

 

Why is the width of each field different? "Phone Number" and "Email" are longer than "Company Name" and this field is longer than the drop-down fields that come below. Also, the First and Last Name have different widths:

 

Screen Shot 2018-06-16 at 11.03.16.png

 

I have already tried to insert different snippets of code, but none of them have worked so far:

 

hbspt-form input[name="lastname"],
.hbspt-form input[name="firstname"]
{
    width: calc(50% + 94px);
}
.hbspt-form input[name="email"],
.hbspt-form input[name="phone"]
 {
    width: calc(95% - 26px);
}

 

.hs-form fieldset {
max-width: none!important;
}

 

What else can I try?

 

Link to the page where you can find the form: https://autotrip.co.uk/free-trial-gps-mileage-tracking-device/.

0 Upvotes
1 Accepted solution
Phil_Vallender
Solution
Most Valuable Member | Diamond Partner
Most Valuable Member | Diamond Partner

Different field width

SOLVE

Hi Nuno, 

 

My dev has suggested you try the following:

fieldset input, fieldset select, fieldset textarea {
   width: 100% !important;
   box-sizing: border-box;
}

Hope this helps.

Phil Vallender | HubSpot Website Agency

View solution in original post

0 Upvotes
4 Replies 4
Phil_Vallender
Solution
Most Valuable Member | Diamond Partner
Most Valuable Member | Diamond Partner

Different field width

SOLVE

Hi Nuno, 

 

My dev has suggested you try the following:

fieldset input, fieldset select, fieldset textarea {
   width: 100% !important;
   box-sizing: border-box;
}

Hope this helps.

Phil Vallender | HubSpot Website Agency
0 Upvotes
KirstenTange
Participant

Different field width

SOLVE

Sorry but where do you put that code? 

 

Thanks in advance! 

0 Upvotes
nunoautotrip
Contributor

Different field width

SOLVE

Thanks a lot, it worked! All the best. 🙂 

0 Upvotes
Phil_Vallender
Most Valuable Member | Diamond Partner
Most Valuable Member | Diamond Partner

Different field width

SOLVE

Great! Smiley Happy

Phil Vallender | HubSpot Website Agency
0 Upvotes