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

    Can we remove default @media rules?

    Asked by Bainn01 on April 27, 2017 at 07:47 PM

    I've noticed forms by default have the following @media screen stylings in CSS.

    @media screen and (max-width: 689px)

    @media screen and (max-width: 689px) and (min-width: 480px)

    @media screen and (max-width: 767px) and (min-width: 480px)

     

    This adds additional padding that isn't required. How do I remove these default @media stylings? I've tried adding my own with !important to override these, but nothing seems to work.

    Any assistance you can provide would be greatly appreciated. Thanks.

    Screenshot
  • Profile Image
    JotForm Support

    Answered by Mike on April 28, 2017 at 12:10 AM

    Those @media rules are a part of our standard theme, so they cannot be removed. You may try to add the next CSS in order to remove mentioned paddings.

    @media screen and (min-width: 1024px) {
    .jotform-form {
    padding: 0;
    }
    }
    @media screen and (max-width: 1024px) and (min-width: 768px) {
    .jotform-form {
    padding: 0;
    }
    }
    @media screen and (max-width: 768px) and (min-width: 480px) {
    .jotform-form {
    padding: 0;
    }
    }

    If you need any further assistance, please let us know.