You are viewing limited content. For full access, please sign in.

Question

Question

Align 3 fields horizontally

asked on February 23, 2022

I'm building a form where I want 3 "columns" so that my fields are align in the same row. I'm struggling with the CSS if anyone has some ideas. The middle one is an HTML box that I'd like in the middle of my row between the radio buttons and comments box. it would also be nice to have the field labels on top, but I don't know how to do that either. 

 

0 0

Replies

replied on February 23, 2022

Besides CSS you can use a table, or if the new Form Designer will work for this form, it supports a grid with columns to place your objects.

You can edit your post and paste your CSS by using the code button

0 0
replied on February 23, 2022

this is a cluster of one of 10 items on a list, would that still work as a table? The first column would be a new question for a radio button, then HMTL text, then comments for about 10 rows where the first two columns would always be different. 

we're on 10.4 right now so I don't think we have that column feature, or I haven't used it before if it is there. 

0 0
replied on February 23, 2022

What I do is create 1 table with 1 row, then duplicate it 10 times and make the change to the question on each.

0 0
replied on February 23, 2022 Show version history

I gave it a go, but I'm not sure how to incorporate HTML text as a column, is that possible? 

0 0
replied on February 23, 2022

Maybe default in a read-only text box. Or put it above/below table field description.

0 0
replied on February 24, 2022

You can try to add in CSS below

 

/* Displays three fields per line */
.ThreePerLine {display: inline-block; width: 31%;}

 

Then on each Field you want, from the Advanced Tab under the CSS Class box enter this:

 

To get your labels to be On Top of the fields you do this under the Form Settings, this will applied to all fields on the form. Click the Settings (gear icon) on the top right of your Design screen.

 

I hope that is what you were wanting. :)

0 0
replied on February 24, 2022

That's a lot better! Is there any way to adjust the width of each item separately rather than having each at 31%? The display is a little off (below). 

 

0 0
replied on February 24, 2022

You might be able to use the Small, Medium, Large and Extra Large options with in each of the Fields.  It is limited for sure.

0 0
replied on February 24, 2022

If you increase the Form's width under the Form Settings or Page orientation to Landscape you might be able to see it all better.

0 0
replied on February 24, 2022

If you are using mobile devices be sure to check the Responsive Layout box. This makes it adjust for small screens.

0 0
You are not allowed to follow up in this post.

Sign in to reply to this post.