[KetigaParticipant]

Hi,

I have a problem which is driving me nuts.

I use gravity forms and as soon as I use a standard radio button field, the radio button and label are not aligned when I view it on a mobile phone in “vertical mode” (see attachment).

As you can see the top radio buttons are the problem.

I added the bottom two to confirm the problem is with the gravity forms standard field. The bottom two buttons are created using a HTML field, probably without any extra css. Therefore I suspect they look OK.

The thing is that using other themes, these standard buttons look fine.

I hope you can help me out.

I will share the site details in a next post so you can access it. THE ISSUE IS VISIBLE ON THE LAST PAGE OF THE FORM.

Thanks!

[KetigaParticipant]

This reply has been marked as private.

[SenthilMember]

Hi There,

Thanks for writing in!
I’m sorry to hear that you’re having this issue.

The alignment is created by the GravityForm’s 2 column alignments.

Please add the following CSS in your Appearance > Customize > Custom > CSS and it will reset the CSS and make the radio buttons at the same line.

.site .gform_wrapper li.gfield.gf_list_2col ul.gfield_radio li {
	width: 100% !important;
	float: none;
	padding:0 !important;
}

Hope it helps, thanks!

[KetigaParticipant]

Hi and thank you for your reply.

Unfortunately that did not work.

I now have also duplicated the field without the 2col style below it and it has the same problem on phones.

[SenthilMember]

Hi There,

We tried applying it and seems to be working fine.

Would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks!

[KetigaParticipant]

This reply has been marked as private.

[KetigaParticipant]

This reply has been marked as private.

[NicoModerator]

Hi There,

As we checked your site, the forms were fine. I used same android phone as you are.

Is there any specific way on how to replicate this issue?

Thank you.

[KetigaParticipant]

I am not sure, but I think you can close this ticket. I managed to make it look a lot better already.

I found it happened on my HTC one, a Sony Xperia and an Iphone 6.

Thank you!

[DarshanaModerator]

Glad you were able to improve it further 🙂

[Author]

Posts