What is JotForm?
JotForm is a free online form builder which helps you create online forms without writing a single line of code. No sign-up required.

At JotForm, we want to make sure that you’re getting the online form builder help that you need. Our friendly customer support team is available 24/7.

We believe that if one user has a question, there could be more users who may have the same question. This is why many of our support forum threads are public and available to be searched and viewed. If you’d like help immediately, feel free to search for a similar question, or submit your question or concern.


  • Profile Image

    Want to change the background to the text.

    Asked by agapeadventures on February 17, 2016 at 10:48 AM

    Hi, I am making a new form and have a background image, but the text in the form has a colour behind which I either want to remove or make a block colour but keep the background image. 

    How do I do this? 

    Page URL:
    https://form.jotformeu.com/52572977076367

  • Profile Image

    Answered by Huberson on February 17, 2016 at 02:43 PM

    Hello,

    To remove the background color from the text inject the following CSS code. It will change it to transparent:

    .form-html span{

        background-color: transparent!important; 

     

    }

    If you still want the background use this one:

    .form-html{

        background-color: #FFF!important;  

    }

    In case you want the background color other than white, adjust both the background for the texts and container as follow: 

    .form-html, .form-html span{

         background-color: #333!important;  

    }

     

    Please let us know if you need further assistance!

  • Profile Image

    Answered by johnsonjohn2016 on February 17, 2016 at 03:03 PM

    Hi,

     

    You want to remove the background colour of the text, for that you need to edit the HTML and remove the inline code “background-color: #ffffff;

     

    Following are the steps for the same:

    1)     Click on the text.

    2)     You can see “Edit HTML” on the top right on the text, click on that.

    3)     Click on the first icon/ menu option which says “Sourc Code”

    4)     You will get the pop-up window, go-ahead and remove the code “background-color: #ffffff;

     

    I think your background image is have some dark portions, people will have difficulty in reading the text and will have a bad user experience. I suggest if you wish to remove the text background colour, then you change the colour of the text so that it’s visible on the background image.

     

    Following are the steps to change the text colour:

    1)     Click on “Preferences” Menu.

    2)     Then click on “From Style” tab.

    3)     Go to “Inject Custom CSS”

    4)     And change the colour for the line

    “.form-label-top,

    .form-label-left,

    .form-label-right,

    .form-html {

    color: #fff;”

     

    Hope this will resolve your issue.

     

    Thanks

     

     

  • Profile Image

    Answered by agapeadventures on February 17, 2016 at 03:46 PM
    Thanks, where do I input the code?
    Sent from my iPhone
    ...
  • Profile Image
    JotForm Support

    Answered by Chriistian on February 17, 2016 at 09:49 PM

    Please follow this guide to find out where to input the css code: How to Inject Custom CSS Codes
    Do let us know if you need further assistance.