Border Form and Images to attach

  • francesca73
    Asked on March 23, 2017 at 9:25 AM

    Hello,

     

    I am looking to understand how to remove the border in this form I just crated and if is possible to ass small icon images beside the Options highlighted and how.

    Many thanks

    Jotform Thread 1099823 Screenshot
  • SafaaAbdulhadi
    Replied on March 23, 2017 at 11:44 AM

    To remove the form border and the shadow box around it, add the following CSS in your form designer

    .supernova .form-all {
        border: none !important;
        box-shadow: none !important;
    }

    This will overwrite the existing form border CSS and remove the border and shadowbox. If you need information on how to add custom CSS into your form, please refer to the following guide:

    How to Inject Custom CSS Codes

     

    To add images next to your Radio buttons, you need to do the following:

    1. click on the properties menu next to your radio button. 

    Border Form and Images to attach Image 1 Screenshot 30

    2. From the properties sidebar, select Options

    Border Form and Images to attach Image 2 Screenshot 41

    3. Add the following HTML code:

    <img alt="Border Form and Images to attach Image-2" src="IMG_URL" style"width: xxpx; height:xxpx;"> for each option you want to add an image to. 

    Make sure to replace IMG_URL with your required image URL, and change xx into the desired width and height values. 

  • John_Benson
    Replied on March 23, 2017 at 2:11 PM

    The solution provided by SafaaAbdulhadi is correct. You need to insert that custom CSS code to remove the box shadow of the form. Also, you can insert an image in the Radio Button options by using HTML tags.

    I checked your form and I can see that the border is now removed. I also noticed that you have now added an image in the Seating field section. 

    Border Form and Images to attach Image 1 Screenshot 20

    If you have questions, please message us again. Thank you.