# Form Field Placement & length Issues

**URL:** <https://community.hubspot.com/t/form-field-placement-length-issues/84001>\
**Category:** Lead Capture Tools\
**Created:** [June 23, 2023, 2:58pm UTC](https://community.hubspot.com/t/form-field-placement-length-issues/84001 "2023-06-23T14:58:33Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![TBromb](https://avatars.discourse-cdn.com/v4/letter/t/ba8739/32.png) [@TBromb](https://community.hubspot.com/u/TBromb)\
**Post date:** [June 23, 2023, 2:58pm UTC](https://community.hubspot.com/t/form-field-placement-length-issues/84001/1 "2023-06-23T14:58:33Z")

</div>

Hi there,

I was wondering if anyone had any advice or suggestions on how to fix an issue I’m having with form field styling.

On the landing page where we’re using the form, there doesn’t seem to be a way to stylize the form fields so they are long enough.

If I add padding in or around the field, you are forced to click into the field and have your cursor in the middle.

 ![Screenshot 2023-06-23 at 9.41.09 AM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/0/c/0c05b9f49e7d92c8f4daff22bea9c0e93ea9ed07.png)

If you remove the padding the field becomes super short and wonky looking.

 ![Screenshot 2023-06-23 at 9.54.20 AM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/6/1/610e5cb4cdd496e5e12a640d34679b16775f1144.png)

Any suggestions or guidance would be very much appreciated

---

<div class="post-metadata">

**Author:** ![PamCotton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/pamcotton/32/47916_2.png) [@PamCotton](https://community.hubspot.com/u/PamCotton)\
**Post date:** [June 23, 2023, 7:59pm UTC](https://community.hubspot.com/t/form-field-placement-length-issues/84001/2 "2023-06-23T19:59:19Z")

</div>

Hello @TBromb, Happy Friday!

Thank you for posting in our Community! Are you able to access the page source to edit from there? ( [This knowledge base](https://knowledge.hubspot.com/forms/manage-your-forms)) and ( [This knowledge base](https://knowledge.hubspot.com/design-manager/understand-the-source-of-a-page-s-styling) ) contains more information.

I want to invite our top experts to this conversation @danmoyle @GRajput @TomM2 any suggestions for the @TBromb matter?

Thank you,

Pam

---

<div class="post-metadata">

**Author:** ![GRajput](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/grajput/32/102020_2.png) [@GRajput](https://community.hubspot.com/u/GRajput)\
**Post date:** [June 26, 2023, 10:58am UTC](https://community.hubspot.com/t/form-field-placement-length-issues/84001/3 "2023-06-26T10:58:00Z")

</div>

Hi @TBromb

1. Yes we could stylize the form so that it doesn’t looks long for that I have Suggestions for you :

We could use the placeholder texts boxes instead of using labels in the top of fields as in the screenshot below :

 ![GRajput_0-1687776924501.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/e/4e3d59189f52fd38152951b08a3ce0db4888859e.png)

2. Another way is that we could use the HubSpot Progressive profiling functionality which asks information step by step. Here is the link for better understanding of Progressive profiling : [Use progressive fields in forms (legacy)](https://knowledge.hubspot.com/forms/use-progressive-fields-in-forms)

---

<div class="post-metadata">

**Author:** ![TomM2](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/tomm2/32/70887_2.png) [@TomM2](https://community.hubspot.com/u/TomM2)\
**Post date:** [June 24, 2023, 12:54pm UTC](https://community.hubspot.com/t/form-field-placement-length-issues/84001/4 "2023-06-24T12:54:15Z")

</div>

@TBromb this would really be down to your website’s stylesheet, it looks like you’re already adding in some custom styling (those icons aren’t standard HubSpot forms) so you can continue to style the fields through the stylesheet you’re using to do that if you like!

You’ll need to find the css classes for the fields and set their width through a css rule for the field width! There’s a great guide on this [on the knowledgebase here](https://knowledge.hubspot.com/forms/how-can-i-share-a-hubspot-form-if-im-using-an-external-site).

You’ll need some experience with css though!

---

<div class="post-metadata">

**Author:** ![danmoyle](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/danmoyle/32/91166_2.png) [@danmoyle](https://community.hubspot.com/u/danmoyle)\
**Post date:** [June 27, 2023, 5:24pm UTC](https://community.hubspot.com/t/form-field-placement-length-issues/84001/5 "2023-06-27T17:24:15Z")

</div>

@TBromb it looks like @TomM2 probably has your answer.

My thought is to start with a few questions.

Is the landing page you’re putting this form on, a HubSpot page? If yes, the theme settings are where I’d go to see what those say. If not, it’s on your main site’s CSS.

Also, in your form settings, what do you have set for your form width?

When you say the form fields aren’t long enough - what do you mean by that? Is there not enough space for the characters you need? That would go back to form width for me. It should be set to 100% width, or if you want a specific pixel width you could do that, too. It’s in the form settings under “style & preview,” under “style,” and general.

Hope that further helps!

Thanks for the tag @PamCotton 🙂
