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

    Product items: How to change the colors shown and again when mouse is over

    Asked by EGSolutions on September 29, 2014 at 08:23 AM

    It's possible to custom the font color of the products title? i tried in style option but the color changed in the other fields and not in paypal wizard.

    Thanks in advance

    Page URL:
    http://www.digitalsmilesystem.com/activation/buy.html

    style font color font product item CSS product CSS
  • Profile Image
    JotForm Support

    Answered by KadeJM on September 29, 2014 at 10:49 AM

    Yes, it's possible to customize your product font color.

    The recommended way to do that is with Injected CSS

     

    Example: 

    http://form.jotform.us/form/42714540327147

     

    Color Code:

    .form-product-item label

    {color: #f00; 

    }

     

    Result: 

     

  • Profile Image

    Answered by EGSolutions on October 08, 2014 at 06:13 AM

    Many thanks made, very helpful. Can you tell me also how I can do for css on mouse over? i cannot find the right class.

    many thanks in advance,

    Eleonora

  • Profile Image

    Answered by Ben on October 08, 2014 at 09:19 AM

    Hi Eleonora

    I am glad to hear that the code you were given by my colleague worked for you as you wanted it. Now to add a style when mouse is over the same product label we apply CSS to hover attribute.

    I will use the code of my colleague and add the part for hover

    Color Code:

    /* Style when the form is opened */
    .form-product-item label
    {
       color: #f00;
    }
    /*When mouse is over product entry*/
    .form-product-item:hover label, .hover-product-item label
    {
       color: #00f;
    }
    /*When mouse is over product label only */
    .form-product-item label:hover, .hover-product-item label:hover
    {
       color: #0f0;
    }

    Do let us know how this works for you.

    Best Regards,
    Ben