CSS changes made inside of Form Designer are not applied to the form

  • Profile Image
    Asked on May 03, 2015 at 12:21 AM

    The font size is too small on the Submit and Clear Form buttons on my website form, but I am not able to enlarge it in the Designer>CSS panel. The CSS for .form-submit-button and .form-submit-reset is unresponsive when I make changes to font-family, font-weight, and font-size. Although changes do appear in the example window to the left of the CSS panel, they do not show up in the Preview window or on my website.

    The problem appears limited to those three attributes, because other properties for those two buttons are responsive to style changes, such text-transform and color choices for font, button background, and button border.

    I would like to enlarge the buttons' font and make it bold. What is the solution?

  • Profile Image
    Answered on May 03, 2015 at 04:43 AM

    I have cloned and tested your form and I noticed that you added CSS for submit button and clear form button that are not shown when form is preview. 

    I have added !important to your CSS code. A rule that has the !important directive will always be applied no matter where that rule appears in the CSS document.

    After adding !important to your CSS code your form will look like this.

    Here is mine cloned form http://form.jotformpro.com/form/51222474077957? 

    Hope this will help. Let us know if you need further assistance. 

  • Profile Image
    Answered on May 03, 2015 at 09:56 AM

    Your solution worked! 👍 I had forgotten about the "!important" command, although have used it before in other situations.

    Thanks so much. I'm grateful. 😀