How can I keep the Comodo secure seal from being HUGE on a mobile device?

  • webflunky
    Asked on May 24, 2017 at 9:38 AM

    I am using the Comodo secure seal and I want to apply some CSS to the image because it is HUGE on a cell phone in portrait mode. I've inspected the element and gone into the CSS to add some sizing, but nothing I've tried has made a difference.

    If you look at the form on a phone, the seal is large and blurry, but nice and small on the desktop version. Or maybe it's something in your responsive CSS that you can tweak on your end, because all other sizes look fine. Even the landscape version on the phone looks good. It's only the portrait version of what I guess to be a 320px width.

    It would be nice if we could size images by percent instead of just px or even be able to add CSS directly to each image.  Can you give me some guidance?

    Jotform Thread 1153340 Screenshot
  • Welvin Support Team Lead
    Replied on May 24, 2017 at 11:37 AM

    Inject the following custom CSS codes to your form:

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

    [data-type=control_image] img {

        width: auto !important;

    }

    Follow oure steps from this guide to inject: https://www.jotform.com/help/117-How-to-Inject-Custom-CSS-Codes

    The result should be its original size, 140px by 140px;

    How can I keep the Comodo secure seal from being HUGE on a mobile device? Image 1 Screenshot 20

  • webflunky
    Replied on May 24, 2017 at 12:15 PM

    That didn't work for me. It made no different at all, but it did point me in the right direction, and this is what I used that worked:

    @media screen and (max-width: 480px) {
    #cid_80 img {width: 30% !important; }
    }

    With #cid_80 being the  id for that area specifically.

    Thank you!

  • Welvin Support Team Lead
    Replied on May 24, 2017 at 1:18 PM

    I'm sorry, but that's great to know. The CSS is for the entire images of the form since I see some of the images are also being stretched out.