Google font not applying to form despite following the CSS instructions

  • Profile Image
    TheSeedFund
    Asked on August 30, 2018 at 10:09 PM

    Hi there,


    Here is my full CSS on my form but the font does not appear:


    <link target="_blank" href="https://fonts.googleapis.com/css?family=Raleway" rel="nofollow noopener ugc" rel="stylesheet">
    .form-all * {
        font-family : 'Raleway', sans-serif;
    }

    .form-label.form-label-auto {
        display : inline-block;
        float : left;
        text-align : left;
    }

    /*responsive full name*/
    [data-type="control_fullname"] .form-sub-label-container {
        width : 50% !important;
        margin : 0;
        float : left;
        box-sizing : border-box;
    }

    [data-type="control_fullname"] .form-label + div .form-sub-label-container {
        display : inline-block;
        padding-right : 5px;
    }

    [data-type="control_fullname"] .form-label + div .form-sub-label-container + .form-sub-label-container {
        margin-right : 0;
        padding-right : 0;
        padding-left : 5px;
    }

    [data-type="control_fullname"] .form-label + div .form-sub-label-container + .form-sub-label-container {
        margin-right : 0;
        padding-right : 0;
        padding-left : 5px;
    }

    [data-type="control_fullname"] .form-label + div .form-sub-label-container + .form-sub-label-container + .form-sub-label-container {
        padding-left : 0;
        padding-right : 5px;
    }

    [data-type="control_fullname"] .form-label + div .form-sub-label-container + .form-sub-label-container + .form-sub-label-container + .form-sub-label-container {
        padding-left : 5px;
        padding-right : 5px;
    }

    [data-type="control_fullname"] .form-label + div .form-sub-label-container + .form-sub-label-container  + .form-sub-label-container + .form-sub-label-container + .form-sub-label-container {
        padding-right : 5px;
        padding-left : 0;
    }

    #sublabel_prefix, #sublabel_first, #sublabel_middle {
        /*margin-bottom : 10px;
        */;
    }

    .form-textarea-limit>span {
        display : block;
    }

  • Profile Image
    roneet
    Answered on August 31, 2018 at 01:47 AM

    The link to API was not imported correctly.

    Could you please check now? I have added below CSS code to your designer.

    @import url(https://fonts.googleapis.com/css?family=Raleway);

    You may also refer to this guide-to-use-Google-Fonts:

    https://www.jotform.com/help/100-How-to-Use-Google-Fonts-and-Custom-Fonts-in-your-Form

    Hope this helps!

    Thanks.