Changing color of header background?

  • Profile Image
    strategicdifferences
    Asked on March 26, 2014 at 08:26 AM

    HO wcan I change the color of the header background please? I am using the pastel them with oransge text. I"ve looked at a few of the similar quesitosn on the forum and none of the CSS code seems to work for me. I currently have the following CSS code exiting in my form - just in case it conflicts with somethign I am trying to ad?

     

    .form-radio { height:15px;width:30px;}

    .form-scale-table th {color: black ;font-size: 12px;font-weight: bold;} .form-scale-table{color: transparent;font-size: 12px;font-weight: bold;}

    em{color:transparent;} .form-header {color:#E6922C} - this gives me my orange text .form-description {right: -80px;}

     

    thanks


  • Profile Image
    Carina
    Answered on March 26, 2014 at 11:31 AM

    Is this http://www.jotform.co/form/40750142430845 the form you are trying to edit?

    Please insert the following css code:

    .form-header-group, {

        background-color: transparent;

        background-image: -moz-linear-gradient(center top , #333333 0%, #4A4A4A 100%);

    }

    Change the green value for the desired color. You can also add this selectors if you wish to change the color of the pagebreaks:

    .form-collapse-table, .form-pagebreak 

    Let us know if we can be of more assistance.

    If it is another form please share with us the form's url.

  • Profile Image
    strategicdifferences
    Answered on March 26, 2014 at 07:55 PM

    yes that is the correct form but the code does not appear to work . Can you explain what the 0% and the secodn colour 100% acheievs please? Maybe I'm not implementing correctly?

     

    thanks!

  • Profile Image
    strategicdifferences
    Answered on March 26, 2014 at 09:16 PM

    hi again - I tried your code and it conflicted with the one above and took off the empahsis hiding and the making transparent the 'worst/best' in my rating scales - coudl soemone respond please with suggested solution to my request please?

  • Profile Image
    Carina
    Answered on March 26, 2014 at 09:57 PM

    moz-linear-gradient is the code for a linear gradient and it gives the coordinates where the gradient begins, as well as the percentage that each color has in order to achieve that gradient.

    If you wish you can learn more about gradients here.

    I'm very sorry that the first code didn't work as you wish. Please try this code instead to change the header's color:

    .form-header-group{

    background-color: #18e1be;

    background-image: none;}

    You can see the result here:

    http://form.jotformpro.com/form/40844262872963

    If you wish to find a color code you can see it here.

    If besides the header you wish to change the page breaks you can use this code instead:

    .form-pagebreak, .form-header-group
    {
    background-color: #18e1be;
    background-image: none;
    }

    For the best/worst label's question please consult this thread:

    http://www.jotform.com/answers/352862

    Let us know if we can be of more assistance.

    Thank you