Button hover doesn't work for one but works for the other

  • Profile Image
    StreamlineWA
    Asked on April 02, 2019 at 04:43 AM

    Hello,

    I've got two buttons on my form; one is a submit button at the end of the form and the other one is "Upload file" button as part of file upload element.

    I'm trying to apply the same style for both buttons - same color, shape, and mouse-hover effect. But can't seem to do it.

    I use the same css injection for both buttons, but it doesn't work as expected. It works for both buttons when I hover my mouse when I'm building the form, but when I preview the form or when I publish the form, it only works for "Submit" button and not the other button. 

    Screenshot of the css injection included below.  






  • Profile Image
    jonathan
    Answered on April 02, 2019 at 08:29 AM

    Can you please check again on your side. I never applied any update on the CSS but refreshed the form only, and it appears to have fixed the issue.

    I see the mouse-over button effect in the Upload field also.

    15542081421779197.gif


    Let us know if issue persist.

  • Profile Image
    roneet
    Answered on April 03, 2019 at 01:58 AM

    It seems you were using the wrong class to inject the CSS. I have updated the CSS.

    Please check now.

    Thanks.

  • Profile Image
    StreamlineWA
    Answered on April 03, 2019 at 02:07 AM

    It works now. Thank you!

    What about changing background color of a widget? I cannot do this using Advance CSS tool as I can't select the widget there. 

    I need to change as per screenshot below.

                    1554271634Capture.JPG

  • Profile Image
    ashwin_d
    Answered on April 03, 2019 at 05:14 AM

    Please inject the following custom css code in your "Checkbox in Dropdown" widget and that should solve your problem:

    .selecter-selected {

        background: url(https://widgets.jotform.io/checkboxInDropdown/img/carret.png) no-repeat scroll right center #fff !important;

    }

    Please check the following guide on how to inject custom css code in the widget:   https://www.jotform.com/help/428-How-to-Inject-CSS-Codes-to-Widgets

    Hope this helps.

    Do get back to us if you have any questions.

  • Profile Image
    StreamlineWA
    Answered on April 04, 2019 at 11:16 PM

    Thank you.