# Change spacing around instructions in forms

**URL:** <https://forums.knack.com/t/change-spacing-around-instructions-in-forms/12822>\
**Category:** Ask Developers\
**Created:** [July 25, 2022, 4:31pm UTC](https://forums.knack.com/t/change-spacing-around-instructions-in-forms/12822 "2022-07-25T16:31:58Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Rick2](https://avatars.discourse-cdn.com/v4/letter/r/df705f/32.png) [@Rick2](https://forums.knack.com/u/Rick2)\
**Post date:** [July 25, 2022, 4:31pm UTC](https://forums.knack.com/t/change-spacing-around-instructions-in-forms/12822/1 "2022-07-25T16:31:59Z")

</div>

There’s several helpful solutions here for moving the instructions in forms above their field or turning them into tooltips (very cool, btw), but I have a slightly different problem. And I have zero CSS skills…

Here’s my issue:  
If you add instructions to a form field, the instructions are spaced below from the field at what appears to be the same distance as between fields in general. In my opinion, this makes for more difficult reading as the instructions are equidistant from both the field they belong to and the heading of the next field in a form.

Here’s a screen shot where I used Chrome’s inspector to highlight what I’d like to get rid of. The annoying spacing seems to be the peach colored margin below the field itself.

![margin](https://us1.discourse-cdn.com/flex020/uploads/knack/original/2X/4/41d5f807e5a5d6166b40dcaaa62a83fac3acc3ef.png)

But I only want to get rid of it when there’s an instruction following (there should still be that margin between form fields).

Any help much appreciated!

---

<div class="post-metadata">

**Author:** ![KnackPros](https://sea2.discourse-cdn.com/flex020/user_avatar/forums.knack.com/knackpros/32/807_2.png) [@KnackPros](https://forums.knack.com/u/KnackPros)\
**Post date:** [July 25, 2022, 11:34pm UTC](https://forums.knack.com/t/change-spacing-around-instructions-in-forms/12822/2 "2022-07-25T23:34:07Z")

</div>

Hi Rick,

You can try adding this code to your CSS:

```auto
form .kn-input:not(.kn-input-paragraph_text) p.kn-instructions {
  margin-top: -12px;
}

```

It adds a negative margin to instructions that appear under any form input (note that paragraph inputs are excluded because those instructions appear on top of the input).

---

<div class="post-metadata">

**Author:** ![Rick2](https://avatars.discourse-cdn.com/v4/letter/r/df705f/32.png) [@Rick2](https://forums.knack.com/u/Rick2)\
**Post date:** [July 27, 2022, 8:43pm UTC](https://forums.knack.com/t/change-spacing-around-instructions-in-forms/12822/3 "2022-07-27T20:43:56Z")

</div>

thanks a lot - works perfect!
