Can I customize the width of the Cards with CSS?

  • vladimirc1984
    Asked on March 3, 2018 at 9:29 AM

    I am trying to Iframe something into the form but the card is not wide enough. Am I able to customize the width when I choose the cards option or is this only possible for the old style form.

    It is the Listing pro By Axium Services form

    Jotform Thread 1404019 Screenshot
  • Adrian
    Replied on March 3, 2018 at 12:38 PM

    Unfortunately, it is not possible to change the width of the JotForm Cards or the Iframe.

    A workaround solution for this could be if you have access to the "Main.css" file on that website or to the "Login.aspx" page.

    Adding this CSS to any of the files would make the Iframe content display a little bit better (it would remove the horizontal scrollbar).

    .master_header_banner {
      width: 100% !important;
      background-size: contain;
      background-position: center;
    }

    1520098551added CSS Screenshot 10

  • vladimirc1984
    Replied on March 3, 2018 at 11:43 PM

     How do I inject custom CSS with the cards?

  • Mike
    Replied on March 4, 2018 at 5:09 AM

    Unfortunately, the custom CSS is not supported on the card forms. I believe that Adrian was referring to the CSS of your web page.

    We have added a feature request ticket to this thread to see if the card width customization can be added to the new layout forms at some point. There is no ETA for when this will be implemented, but we will let you know if we have any updates.

  • vladimirc1984
    Replied on April 11, 2018 at 9:32 PM

    Do you have an update on the custom CSS on cards feature request?

  • Kevin Support Team Lead
    Replied on April 11, 2018 at 10:39 PM

    We do not have any update yet on this request, please note that feature requests may be considered based on the number of users requesting the same, unfortunately, we cannot provide an ETA or ensure if this will be implemented, but we would let you know in case we hear anything from our second level. 

    Thanks.