You may want to use column-count: 2; with the form main wrapper.
@codekraft Thanks for the reply. I’m not very experienced with this sort of coding so I’m a bit confused with that you mean. Do you think you could write out the line of code you are talking about?
this will setup a 2 columns form easly
form.wpcf7-form {
column-count: 2;
column-gap: 50px;
}
all you need to do is make the input heights equal and they will align themselves
@codekraft do I add that code in the form area (2nd screenshot) or in the css area?
@codekraft After doing that, it now looks like this:
https://gyazo.com/afeb1296474d732650f4263d489e8275
Is there a way to force certain elements into the 2nd column so that it looks like this?
https://gyazo.com/ab9df2efa4e2df3e61d5ca9c2c66adb0
yup you can! you need to wrap the elements you want into the column then style with:
break-inside: avoid;
like:
<form style="column-count: 2;column-gap: 50px;">
<div style="break-inside: avoid;">
...form part 1...
</div>
<div style="break-inside: avoid;">
...form part 2...
</div>
</form>
