CSS not working when preview form

  • Profile Image
    markkeane
    Asked on February 10, 2017 at 08:10 AM

    Hi there, 

    I have added some custom css to my form, when in design mood it looks perfect and works as it is supposed too but when I preview the form the hover css is not working. Can you please let me know what is the issue here.

     

    Regards

     

    Mark

  • Profile Image
    Kiran
    Answered on February 10, 2017 at 10:14 AM

    Please change the .(dot) to :(colon) in the CSS code before hover which should be working fine. The CSS code can be as below:

    #input_10:hover {

        background : #52247f;

        border : 2px solid;

        border-color : #52247f;

        color : #ffffff;

        font-weight : bold;

        text-shadow : none;

    }

    Hope this information helps! 

  • Profile Image
    markkeane
    Answered on February 14, 2017 at 07:12 AM

    Thanks Kiran fix that work fine. I just seem to have white line at the top of the button when i hover over it? What is causing this? I would like this removed.

  • Profile Image
    Kiran
    Answered on February 14, 2017 at 08:25 AM

    This is being caused by the box border. Please add the following code to the form so that it should be displaying with full background.

    .form-submit-button {

        -webkit-box-shadow: none;

        box-shadow: none;

    }

    Hope this information helps! 

  • Profile Image
    markkeane
    Answered on February 16, 2017 at 02:40 PM

    Thanks Kiran that work perfectly.