Make Form Compact

Looking for some help. I’ve Google’d and searched here and haven’t had any luck.

I have a form on and I am trying to make it more compact and reduce the space between the fields. I have put all the padding at 0 in the style & layouts area and removed the description areas in the style & layouts area.

Any help is greatly appreciated.

The space between the fields is added through a top-margin on the list-item (li.gfield).

Are you familiar with the available developers tools in your browser? These tools are extremely useful (especially in cases like this) :slight_smile:

1 Like

I’t not. I guess I need to figure it out.

From what I see upon further investigation it’s a combination of the top-margin on the list-item and a bottom-margin on inputs.

In your style.css there’s a 20px bottom-margin for inputs with the types text, password and email (plus textareas and selects). Disabling that bottom-margin (overall or specifically for that form) should do the trick :slight_smile:


Thank you very much! Ill work on it here soon. Really appreciate it!