Skuid Field Editor alignment issue

For the field editor with the Field Layout type “Label above field”, the field-editor-items of different columns are not aligned in the same line.

If a field-editor-item has no value then the height of that field-editor-item is less compared to the field-editor-item with value. If we provide the fixed height for the field-editor-item(by using nx-fieldtext Css class) this will resolve the issue at most of the places but if the field-editor-item data type is a checkbox the issue occurs again(since checkbox size is constant and we cannot resize it accordingly).

If you’re using newer version of skuid you can format the form as follows:

  • create row for each row - in your case that would be 6 rows
  • Then in each row add 2 columns
    If you’re using new version of skuid, yours is formatted the other way round.

e.g. where template is actually your field.

A couple notes:

  • If you’re encountering this issue in API v1, you can resolve it by adding CSS to manually set the field height to the desired amount (e.g. 64px)
  • If you’re in API v2, the field heights should all be uniform out of the box.

@lukaspovilonis’ solution shows v2 :+1: