Fields in line in multi column layout

[SkayyHH]

Hello Jan,

is it possible to get the fields all in the same size in the multi column layout? My fields and elements they are not in line with the other fields. Dropdown fix didn't quite help.

And how did you get the lookups flat with the dropdown fix in your docs on your website? Mine still have the original appgini design. Only the buttons and the distance between the labels have changed.

Thank you very much, Kai

[onoehring]

Hi Kai,

it seems that your images are missing in this post.
Olaf

[jsetzer]

Hello Kai,

(1) there is no function in AppGini Helper Javascript Library for changing the height of all (single-line) form-controls and giving them the same height. If you want to try on your own, I think lookups and dates (year-, month-, day-selector + button) will be most complicated because they are a combination of controls placed inside a div. Also Checkboxes and Option-list (as dropdown or as radios) may be complicated to adjust to all other controls.

(2) I have changed a couple of css styes like border-radius, padding, margin and border-column-colors for making it "flat".

Regards,
Jan

@Olaf: I can see his uploaded pictures.

[SkayyHH]

Hello Jan,

many thanks. I didn't know exactly whether your scripts act with that. Then I do that with css.

Many greetings, Kai

[jsetzer]

@Kai and @all customers facing a similar issue:


Please remember that our multi-column layout feature is a multi-COLUMN-layout:

POWERPNT_wxiBHsxiAw.png (13.63 KiB) Viewed 2941 times

The issue

Different controls have different heights, for example an input has a different height than a textarea.

POWERPNT_Nrjck45p1t.png (11.15 KiB) Viewed 2941 times

The top-position of a follow-up control depends on (top+height+margin) of the control above, not on y-position of any "nearby" control in column to the left.

The following drawing should be good for illustration:

POWERPNT_Dnbrtv4a0t.png (10.12 KiB) Viewed 2941 times

So this is exactly what is happening here:

POWERPNT_l3JURvghOT.png (46.8 KiB) Viewed 2941 times

This is by design. It is not a software bug but an error in reasoning: "thinking in rows".

Multi-column layout has been designed for "thinking in columns":

POWERPNT_Sdt9cIRRpM.png (54.18 KiB) Viewed 2941 times

Another example

chrome_pnikJGdBgK.png (62.15 KiB) Viewed 2941 times

Alternatives

So, if you are trying to mimic a vertically-aligned layout, you should use the inline-feature (https://appgini.bizzworxx.de/products/j ... ine-fields) or build your layout differently:

POWERPNT_hUJaI7VTt3.png (12.61 KiB) Viewed 2941 times

I really hope this will help understanding multi-column layout. Any feedback appreciated!

Kind regards,
Jan