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

    css code doesn't work!

    Asked by suke on July 25, 2011 at 10:26 AM

    hi

    thx for timing

    i don't know why css code that u say to me  just work for the first time!

    this is the code:http://yang.interlogy.com:82/answers/35537-Re-How-to-customize-Pastel-theme#1

    when i insert this code in form style i see the change but when i click on preview it's change just for the first time and after that in form style it's still have changes but in preview changes not showing and have pastel theme yet.

    may be you creat a theme with pastel and this color: #3b5998 such as the pic i send for u(right pic)?

    this is the pic link: https://cms.jotform.com/uploads/answers/answer/suke/35537_help.jpg 

    thx for your supporting :)

    all the best

     

  • Profile Image
    JotForm Support

    Answered by mliz on July 25, 2011 at 11:10 AM

    Hi there,

    The closing tag for the css code of the form header was duplicated which created
    conflict with the css of the submit button.

    I managed to duplicate the form for testing purposes you can find the working
    sample here:  http://www.jotform.com/form/12053110517

    This is the code without  the duplicate closing tag:


    .form-header { color:#ffffff; background:#3b5998; }
    .form-header-group {
    background:none repeat scroll 0 0 #3b5998;
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    background: #3b5998;background: -moz-linear-gradient(top, #3b5998 0%, #3b5998 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0004ff), color-stop(100%,#0303cf));
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b5998', endColorstr='#3b5998',GradientType=0 );
    border: 2px solid #FFFFFF;
    color: #FFFFFF;
    font-size: 16px;
    font-weight: bold;
    margin: 0;
    overflow: visible;
    padding: 10px;text-shadow: 0 0 5px #777777;
    width: auto;
    }

    .form-submit-button, .form-submit-reset, .form-submit-print {
    -moz-border-radius: 5px 5px 5px 5px;
    -webkit-border-radius: 5px 5px 5px 5px;
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
    background: #3b5998;
    background: -moz-linear-gradient(top, #3b5998 0%, #3b5998 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#3b5998), color-stop(100%,#3b5998));
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3b5998', endColorstr='#3b5998',GradientType=0 );
     border: 2px solid #FFFFFF;
     color: #FFFFFF;
     font-size: 16px;
     font-weight: bold;
     margin: 0;
     overflow: visible;
     padding: 10px;
     text-shadow: 0 0 5px #777777;
     width: auto; }

    Hope this helps.

    Regards,
    Mliz