CMS Development

sarahg1
Participante

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

The mobile version of this page (the form that's on it) has the check boxes and radio buttons aligned on top of each category instead of next to them. Wondering if anyone knows how to align them to the left of each option to mimic the desktop version of this form? See the page here: https://www.eojohnson.com/non-sales-lead-contact-form

0 Avaliação positiva
1 Solução aceita
Mike_Eastwood
Solução
Conselheiro(a) de destaque | Parceiro Ouro
Conselheiro(a) de destaque | Parceiro Ouro

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

Apologies for the delayed reaction @sarahg1 

 

Here's a snippet of CSS that should fix it:

@media (max-width: 650px) {
    .cst-bdy-cnt-grp .page-center.content-wrapper .hs-service-r1-flexi form .hs-form-checkbox-display .hs-input {
        margin: 8px 5px 0;
        width: auto !important;
    }
}

You can add this code snippet to your page or your global CSS (if you have other forms).

 

Please let me know if you want help with this.

Mike

Exibir solução no post original

0 Avaliação positiva
5 Respostas 5
sarahg1
Participante

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

Hi @Mike_Eastwood

 

Looks like you may have solved something similar in a previous post, but that solution isn't working for me. Any thoughts on this one?

 

Thanks

0 Avaliação positiva
Mike_Eastwood
Solução
Conselheiro(a) de destaque | Parceiro Ouro
Conselheiro(a) de destaque | Parceiro Ouro

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

Apologies for the delayed reaction @sarahg1 

 

Here's a snippet of CSS that should fix it:

@media (max-width: 650px) {
    .cst-bdy-cnt-grp .page-center.content-wrapper .hs-service-r1-flexi form .hs-form-checkbox-display .hs-input {
        margin: 8px 5px 0;
        width: auto !important;
    }
}

You can add this code snippet to your page or your global CSS (if you have other forms).

 

Please let me know if you want help with this.

Mike

0 Avaliação positiva
sarahg1
Participante

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

Thank you, @Mike_Eastwood!! It worked perfectly. Is there a similar snippet we could use to apply the same affect to the radio button question near the bottom of the form?

0 Avaliação positiva
Mike_Eastwood
Conselheiro(a) de destaque | Parceiro Ouro
Conselheiro(a) de destaque | Parceiro Ouro

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

Hi Sarah, looks like you worked it out!

 

Nice work

Mike

0 Avaliação positiva
sarahg1
Participante

How do I make multi-select and radio button questions mobile-friendly in forms?

resolver

Thanks for your help!!

0 Avaliação positiva