ChronoForms V4 Fields Side by Side

Hi, i was looking for some help in regards to putting some fields side by side. I have managed to find the following link to do this:

http://www.chronoengine.com/forums/index.php?option=com_chronoforums&cont=posts&f=2&t=77070

but this doesnt apply to V4. Any ideas?

Hi mediad ,

Most of the elements have options for 'Start a multi-slement row' and 'Add to a multi-element row'. These may do what you need but there are some CSS bugs.

Bob

Thanks GreyHead does the trick. Mind you I have come across some issues in terms of aligning with the rest of the other fields. Any tips to fix this?

Thanks once again btw.

Hi mediad ,

Not without seeing the form with the problem - there are too many ways that the CSS & HTML in the form, page and template can interact.

If it's a big problem you can always put the form elements into a table structure - it takes more Custom elements but can work OK.

Bob

Greyhead apologies for the delay in responding. Had a personal tragedy in the family so been out of action for a while. I am back to trying to fix this form and the form itself can be found on the following link:

http://smartenergyconnections.co.uk/cms/index.php/contactus

As you can see I have three fields in 1 line but the last field (Label - Electric) has the field off alignment compared to the boxes. Not sure how i can get this aligned with the rest of the page.

Thanks once again btw for your help.

Hi mediad,

I'm sorry to hear that - I hope that all is settling down again.

You can tweak the label and box sizes using a Load CSS action. Here's one possibility:

div.multiline_add input {
  width: 55px;
}

You may need to tweak the selector or add !important to the style to get it to work from the action.

Bob

Thanks Greyhead for your prompt response : )

I will have a look at this tonight and will let you know how i get on. My brother (whose website it is) has now changed the layout of his form, so will just start by creating a new form and implementing the tweaks you have suggested.

Thanks for your assistance once again, really appreciate it.

Hi mediad,

If you use your web browser developer tools (usually F12) then you can play with the CSS 'live' to see what is being applied and what needs changing.

Bob

PS If Gas & Electricity are Yes/No questions then I'd use checkboxes or radio button pairs.

GreyHead thanks for your help. I added the following code:

div.multiline_add input {
  width: 55px;
}

and that did the trick! : )

The only thing I have noticed is that the contact page appears all over the place in Opera, so now trying to work out how to fix this.. lol