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
    JotForm Support

    I Have Spotted What Seem to be Mistakes in Your Injected CSS

    Asked by abajan on December 17, 2011 at 10:45 AM

    This post is a response to webminister's post in
    http://www.jotform.com/answers/50699-Formatting-text-inside-a-radio-button

    Nice way to get that "OR" between the radio buttons but I had a look at your injected CSS and spotted what appear to be mistakes. Here are my (unsolicited) suggestions:

    · The second declaration in the first rule can be shortened to padding:2px 10px; because they are both interpreted by user agents to mean "Give the selected element(s) a top padding of 2 pixels, a right padding of 10 pixels, a bottom padding of 2 pixels and a left padding of 10 pixels". (Examples of this and other CSS shorthand declarations can be found here and here.)

    · The last declaration in the said rule should have a space instead of a semicolon between none and !important

    · The first declaration in the third rule is not needed as it repeats what was already declared in the first rule. At any rate, it would be better to simply discard the third rule and transfer its remaining delcarations to the first rule. So, the following two rules:

    .form-all input {
    -webkit-border-radius:20px;
    padding:2px 10px 2px 10px;
    background:#e1f3fd;
    border:none;!important;
    }

    ...

    .form-all input {
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    }

    become just

    .form-all input {
    -webkit-border-radius:20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    padding:2px 10px;
    background:#e1f3fd;
    border:none !important;
    }

    · I'm pretty sure that the correct value of the last rule's declaration should be inline-block instead of block-inline

    Of course, it's quite possible that you might well be employing a hack or two of which I'm ignorant that is (are) achieving the results you wish.