Radio Buttons field I want to change the column widths between the text and the buttons [RESOLVED]

Get Help
1

Hi, I have a form here https://canadasautoloan.ca/sell-your-car-form-page/ you can fill in dummy text and get to page 3.
On there I have Radio Buttons setup. But the issue is the left side is set to 30% width, and the right is set to 70% width, and the right side radio buttons are aligned to the left side. This squished my text up and makes the radio buttons right up against the text.

I would like the left text to be bigger (like 70%) and the right side to be smaller (like 30%) and I would like the right side radio buttons to be aligned with the right side of the area box, and not up against the left side close to the text.

I also want it to only change on this form, and not my other forms if possible.

Thank you!

2

Here are the 2 examples, I can’t paste more that 2 links in my question.

How it looks now canadianllama

How I would like it to look canadianllama

3

Checking your form it looks fine to me, with inline Gravity Forms styles applying 60% width to the choice label, example: Screenshot gaYzslYLAv.png - Droplr

4

Thank you, I did figure out some code that worked, but I wasn’t able to have it apply to only that form, as its site wide CSS. Any idea how to make it form specific?

.gform_wrapper.gravity-theme .gform_fields.left_label legend.gfield_label, .gform_wrapper.gravity-theme .gform_fields.right_label legend.gfield_label {
    display: block;
    float: left;
    padding-right: 1em;
    width: 60%;
}
.gform_wrapper.gravity-theme .gform_fields.left_label fieldset .ginput_container, .gform_wrapper.gravity-theme .gform_fields.right_label fieldset .ginput_container {
    float: left;
    width: 40%;
}
1 Like
5

You’re welcome :wink:

You can just replace all the occurrences of .gform_wrapper with #gform_wrapper_8

That will reduce the scope of the CSS snippet to form id 8.

1 Like
6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.