How do you get rid of white background around form pattern background.

  • Profile Image
    BigBrain
    Asked on May 16, 2012 at 04:46 PM

    I've used a patterned image 100 x 100 px as a background for the form. But I can't seem to get that pattern image into the actual whole (outer) form background since whenever you a form warning comes up, it leaves the white area below behind.

    One other thing also...is it possible to change the text entry field color from something other than white as well (the textbox and textarea calls weren't consistent). See attached jpeg (White Area.jpg).

    This is the code I injected:

    .form-all{

    background-image:url('http://www.image12.com/Footer/Footer-RGB81-Pattern.png');

    }

    .form-line { background: none; }.form-line {

    padding-left: 0px !important;

    padding-right: 0px !important;

    }

     

  • Profile Image
    idarktech
    Answered on May 16, 2012 at 10:59 PM

    Hi,

    Is this what you are trying to achieved? http://form.jotform.co/form/21369131136851?

    You can clone this if you like.

    Please let us know so that we can further assist you. Thanks!

  • Profile Image
    jeanettebmz
    Answered on May 16, 2012 at 11:01 PM

    If I understood you correctly, you want to change the white area of your form to something similar like this

    Just click on Form style and then Background, choose the color pattern of your preference

     

    Cheers

    Jeanette

  • Profile Image
    BigBrain
    Answered on May 17, 2012 at 11:18 AM

    Thanks idarktech. Looks like I missed increasing bottom padding to account for the form warnings.

    One last question: Is it possible to change the text entry field color from something other than white to a light gray (#cccccc)  as well?

    @Jeanette - I wanted to insert the actual image (pattern) not just match the color of it. The form (with the patterned background) sits on that patterned background.

  • Profile Image
    jeanettebmz
    Answered on May 17, 2012 at 04:51 PM

    I am sorry for the misunderstanding

    Please insert the following code into your form

    body, html{

    background-image:url('http://www.thinkgraymatter.com/Footer/Footer-RGB81-Pattern.png')!important;

    }

    Click Here  ,  this is my form which you can clone it in order to accomplish the last  question along with the desire background pattern

    Should you need further assistance , let us know

    Jeanette

  • Profile Image
    BigBrain
    Answered on May 17, 2012 at 06:35 PM

    Perfect...thanks for the assistance.

  • Profile Image
    jeanettebmz
    Answered on May 17, 2012 at 06:37 PM

    You are welcome!

    Jeanette

  • Profile Image
    blacktiemultimedia
    Answered on February 11, 2013 at 01:30 PM

    Jeanette,

    I also would like to know how to make the white box around the text transparent. The rest of the form currently has a transparent background.  As it is now, I have white text on a white background for the heading. I tried the link you supplied above but I don't think it is working right now.

  • Profile Image
    pinoytech
    Answered on February 11, 2013 at 02:04 PM

    @blacktiemultimedia,

    Can you please share to us the URL of your Form for further assistance?

    Thank you!

  • Profile Image
    jeanettebmz
    Answered on February 11, 2013 at 03:53 PM

    @blacktiemultimedia

    My form example should be ok now

    On regards to your questions and like Pinoytech has adviced to you, it would be better for you to open a separate thread with similar Title to assist you further