How to set several elements on the same form line (side by side)

[lvth]

I'm building a form to accept personal data (Name, mail, address, phone, etc etc...) but I would like to make it more "compact", placing several elements on the same line in the form. As an example:
First row: FirstName.... LastName... MailAddr
Second row: (address) StreetName... Number... ZipCode... Town... State...
Third row: info1... info2...
and so on.
I've spent some time (hours...) searching for this method without finding any explanation, only a very old post (http://fabrikar.com/forums/index.ph...ingle-line-rather-than-below-each-other.6165/) last interaction in 2018...
Can anyone just point me in the correct direction?
Thanks in advance.
Luigi

 

[BasilC]

Hi, the number of elements per line is set by editing the layout of the group that the elements are in. You can change the number of columns that the elements are displayed in and you can edit the widths of each column. www.fabrikar.com/forums/index.php?wiki/groups/#add-edit-a-group.

I think (but someone will correct me if I'm wrong) that if you want some elements to be displayed three across and others four across etc you'll have to put them in separate groups. You then order the groups within the form.

 

[lvth]

Thanks a lot @BasilC, I've found very interesting the link you suggested. Now I have to find how to design elements in graphical form (the width of label and field, as an example the row for the address should have a large field for the street name, then a narrow one for the number, same narrow for ZIP and state, the a large one for town name.
And so on...
I hope to be able to define CSS to achieve this, then there is the "responsive" aspect, when the form is displayed on a big screen (pc) or middle (tablet) or small (Smartphone)...
Good luck to me.
Cheers
Luigi

 

[BasilC]

Here's a form I designed - as you'll see the fields stack on mobile phones, it's built into Bootstrap. I had to use more than one group to get what I wanted, different numbers of elements on different lines.

https://pgsu3a.org.uk/apply-online

Buona fortuna! Spero che tutto va bene.

 

[lvth]

Hi Basil, thanks a lot for your sample, it's very interesting... I'll try to build mine.
Cheers
Luigi