how to remove !important from CSS code

  • Profile Image
    Asked on September 23, 2014 at 05:00 PM

    I am trying to increase the width of a particular label and through Chrome developer tool have finally realized that the following rule is overruling my CSS custom rule

    <style type="text/css">


       width: 150px !important;


    How can I get rid of the !important. This is overriding everything.


    Beth H.

  • Profile Image
    Answered on September 23, 2014 at 05:24 PM

    Hi campbuc,

    Sorry about the issue with the CSS overriding your injected CSS code.

    To resolve the issue, you would add the !important to your injected CSS code.

    The code would look like this:

    .form-label-left {
        width: 500px !important;

    You would use your desired size.

    You can see the full guide on how to inject your code at this link:

    I hope this helps!

  • Profile Image
    Answered on September 23, 2014 at 06:41 PM

    Hi Beth,

    Yes it is correct that the word !important will override when used on the same class or element id# in the CSS rules.

    So if you want to prevent your CSS code from overriding the whole class


       width: 150px !important;



    then just remove the !important on it. So, it becomes like this


       width: 150px;



    I checked your jotform and I can see that the custom injected CSS code were already updated to this


    I will assume then that you now have a better understanding how to modify the CSS code on your jotform.

    Hope this help. Inform us if you need further assistance.