# Trouble with form input fields (updated)

**URL:** <https://community.hubspot.com/t/trouble-with-form-input-fields-updated/51769>\
**Category:** CMS Development\
**Tags:** css, forms\
**Created:** [February 17, 2022, 5:16pm UTC](https://community.hubspot.com/t/trouble-with-form-input-fields-updated/51769 "2022-02-17T17:16:00Z")\
**Posts on this page:** 1\
**Showing post:** 2

<div class="post-metadata">

**Author:** ![alyssamwilie](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/alyssamwilie/32/2072_2.png) [@alyssamwilie](https://community.hubspot.com/u/alyssamwilie)\
**Post date:** [February 17, 2022, 7:07pm UTC](https://community.hubspot.com/t/trouble-with-form-input-fields-updated/51769/2 "2022-02-17T19:07:39Z")

</div>

@RVanKammen The reason it shrinks to 350 when you click into an input is because the :focus state has box-sizing: border-box; set on it. So if you add box-sizing: border-box; to the non-focus state this would fix your issue. What **box-sizing: border-box;** basically does is tell the width to include the padding and border.

```lia-code-sample
form textarea,
form select,
form input[type=text],
form input[type=email],
form input[type=password],
form input[type=tel],
form input[type=number],
form input[type=file],
input[type=string] {
 box-sizing: border-box;
 width: 350px;
}

```

---

_[View the full topic](https://community.hubspot.com/t/trouble-with-form-input-fields-updated/51769)._
