Worldpay product selection horizontal alignment

  • DerekMurrell
    Asked on July 23, 2014 at 7:57 AM

    Is there a way to get the radio button options in the worldpay widget to align horizontally instead of vertically as i have 34 options which would make a long form?

     

    Thanks


    Derek

    Jotform Thread 407179 Screenshot
  • jedcadorna
    Replied on July 23, 2014 at 9:29 AM

    You can inject css to align the options. I'll make a sample and get back to you once done. You can also share your form so we can provide a correct css for your form.

     

  • DerekMurrell
    Replied on July 23, 2014 at 10:18 AM

    Thank you for your help, ill share the form once completed, thanks again.

  • jedcadorna
    Replied on July 23, 2014 at 10:22 AM

    You can align your product like this.

    Worldpay product selection horizontal alignment Image 1 Screenshot 20

    Inject this css to your form to and you can adjust the width of .form-product-item. As you adjust the width the alignment change.

    .form-product-item {

    border: 1px solid #EFEFEF;

    margin: 1px;

    float: center;

    width: 150px;

    }

    .form-product-item + br {

    display:none !important;

    }

     

    Here's a guide on how to inject custom CSS in your form https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes 

  • DerekMurrell
    Replied on July 23, 2014 at 10:56 AM

    Thank you so much for your help as always, this works a treat

     

    Derek

  • Elton Support Team Lead
    Replied on July 23, 2014 at 12:06 PM

    @Derek

    On behalf of my colleague, you're welcome.

    Cheers! =)