Different field width

SOLVE
Highlighted
Regular Contributor

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/.

Reply
0 Upvotes
1 Accepted solution

Accepted Solutions
Highlighted
Community Thought Leader | Diamond Partner

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 | Inbound marketing for B2B technology companies
Reply
0 Upvotes
4 Replies 4
Highlighted
Community Thought Leader | Diamond Partner

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 | Inbound marketing for B2B technology companies
Reply
0 Upvotes
Highlighted
Regular Contributor

Thanks a lot, it worked! All the best. Smiley Happy 

Reply
0 Upvotes
Highlighted
Community Thought Leader | Diamond Partner

Great! Smiley Happy

Phil Vallender | Inbound marketing for B2B technology companies
Reply
0 Upvotes
Highlighted
New Contributor

Sorry but where do you put that code? 

 

Thanks in advance! 

Reply
0 Upvotes