Modify form rows, spacing, radio buttons, etc with javascript or CSS


#1

Hi,

we are trying to make a simple survey with the form that Unbounce offers. (we don’t want to use an external server as f.e 123contactform or Wufoo.

For each question there’s only one possible choice. That’s why we’d like to use drop-down menus and Radio Buttons.

The first problem would be the size of the Radio Buttons. It can’t be modify in the properties panel. They are extremely small compared to the size of the page (W:1087) and even smaller for the mobile version.That makes it difficult for the mobile users to actually touch and choose the option.

Can the size of this radio buttons be changed with a Javascript or a CSS code? If yes, how? #thankyou

The other problem would be the by the drop-down menu. The width is as long as the box of the form is, making the field looks weird and unfortunately not as we wish.

So, the question would be the same as below…
Is there a javascript or CSS code to manipulate the fields? Also the spacing between field (question - options) and field?

I hope you get what I’m tried to explain and yu can help me anyhow!

Thanx in advance
Isabel


#2

I have similar issues similar to Isabel above with radio button fields spacing immediately below the label.

  • Trying to tweak the Field Attributes - Height, Spacing and Size in the properties panel doesn’t change anything on the radio fields itself.
  • Trying to resize the form also doesn’t space out the vertical radio buttons and between the label and the radio button fields.