How to fix the banner to make it mobile-friendly?

  • RuthKlein
    Asked on March 31, 2023 at 1:34 PM
  • Christy JotForm Support
    Replied on April 2, 2023 at 11:06 AM

    Hi Ruth,

    This is in response to the concern you raised during our chat session. To fix the banner in mobile view, we need to inject custom CSS into your form. Let me walk you through it, step by step:

    • Click on the Paint Roller icon to open the Form Designer.
    • Click on the Styles tab and scroll down to Inject Custom CSS.
    • Copy and paste this code:
    @media only screen and (max-width: 480px){
    .form-all {
      margin-top: 150px !important;
    }
    .form-all:before {
      top: -165px !important;
      background-size: contain;
    }
    }
    • Click on Save and preview your form.

    Check out the screenshot below to see my result:

    1680447959 642999d7aa08e  Screenshot 10

    Reach out again if there's anything else we can do for you.