Page 1 of 1

form in flex container

Posted: Thu Dec 10, 2020 6:29 pm
by Timbo
I built a form and tested it, works great. After looking at the webpage on my phone I realized it dosen't expand to the size of my phone. (its the only thing on the page) I added a flex contanier and tried to drag the form into it but it doesn't go. Any ideas?

Re: form in flex container

Posted: Thu Dec 10, 2020 6:33 pm
by Pablo
A form is a fixed/absolute container so it cannot be added to a flex grid.
However, the flex grid itself can also be a form to create flexible forum layout.

You can also create flexible forms with the Form Wizard.

Re: form in flex container

Posted: Thu Dec 10, 2020 6:35 pm
by Timbo
ok thanks

Re: form in flex container

Posted: Thu Dec 10, 2020 6:47 pm
by Timbo
What do I need to add inside a flex container so it does not collapse?
When I add my form elements they go all over the place

Re: form in flex container

Posted: Thu Dec 10, 2020 8:56 pm
by Pablo
If you are not familiar with flexbox design then I suggest to start with layout grids instead. Layout grids have fewer options.

Related tutorials:
https://www.wysiwygwebbuilder.com/layoutgrid_part1.html
https://www.wysiwygwebbuilder.com/layoutgrid_part2.html

https://www.wysiwygwebbuilder.com/flexbox.html

Also, note that there many example templates with forms:
https://www.wysiwygwebbuilder.com/templates.html

Re: form in flex container

Posted: Fri Dec 11, 2020 6:43 pm
by Timbo
Pablo wrote: Thu Dec 10, 2020 6:33 pm You can also create flexible forms with the Form Wizard.
For a flex form using the form builder, do I want to build from a template, from scratch with wizard or Blank to add controls later?

Re: form in flex container

Posted: Fri Dec 11, 2020 6:58 pm
by Pablo
I think it is whatever works best for you.

You can also drag & drop the form elements you already have to a layout grid.

Re: form in flex container

Posted: Fri Dec 11, 2020 7:53 pm
by Timbo
I will keep playing with it but this fixed my issue:

Code: Select all

<meta name="viewport" content="width=device-width, initial-scale=1">

Re: form in flex container

Posted: Fri Dec 11, 2020 9:07 pm
by Pablo
Note this this code will automatically be added by the software when
- you use layout grids
or
- add breakpoints