How can I remove the superfluous padding in Forms?

  • 9 February 2016
  • 3 replies
  • 10 views

Badge +11

One of the most annoying things with Nintex Forms (2013 and 365 versions that I deal with daily) is the unnecessary padding:

Setup like this during design (365 Nintex Form):
InputBoxesOverPadding.PNG

....gives the following at runtime:

FormInputBoxesOverPadding.PNG

..what a waste of space.

Is there no way of reducing this space? It's a real pain.


3 replies

Badge +11

You can use CSS to modify the completely modify the layout of your form. Publish your form or open it in preview mode and use your browsers developer tools (F12) to find the html elements you want to style. For bigger customizations I would rather use complete stylesheets and just reference them in the form settings than writing the CSS directly in the Custom CSS area of the form settings.

You can also try to modify the existing css and see if you find a way to reduce the padding globally.

Badge +11

everything I try seems to be over-ridden by CSS from somewhere else. Not sure how to switch-out the whole css.

Badge +2

As already Philipp Lucas​ wrote, use the developer tools to find the html elements you want to style. To prevent overwritting your settings use "!important" in your css definitions e.g. "padding:0px !important;".

Reply