Multiple W3C Validation Errors

  • faithemc
    Asked on October 21, 2015 at 2:01 PM

    When validating a page in which a JotForm has been added there are multiple W3C validation error:

     

    Error: Element link is missing required attribute property.

    From line 167, column 25; to line 167, column 122

              <link href="https://cdn.jotfor.ms/static/formCss.css?3.3.9556" rel="stylesheet" type="text/css" />↩     

    Error: Element link is missing required attribute property.

    From line 168, column 25; to line 168, column 123

              <link type="text/css" rel="stylesheet" href="https://cdn.jotfor.ms/css/styles/nova.css?3.3.9556" />↩     

    Error: Element link is missing required attribute property.

    From line 169, column 25; to line 169, column 135

              <link type="text/css" media="print" rel="stylesheet" href="https://cdn.jotfor.ms/css/printForm.css?3.3.9556" />↩     

    Error: Element style not allowed as child of element div in this context. (Suppressing further errors from this subtree.)

    From line 170, column 25; to line 170, column 47

              <style type="text/css">↩     

    Error: The for attribute of the label element must refer to a non-hidden form control.

    From line 197, column 41; to line 197, column 125

              <label class="form-label form-label-left form-label-auto" id="label_1" for="input_1"> Full 

    Error: The for attribute of the label element must refer to a non-hidden form control.

    From line 216, column 41; to line 216, column 125

              <label class="form-label form-label-left form-label-auto" id="label_4" for="input_4"> Phone

    Error: The for attribute of the label element must refer to a non-hidden form control.

    From line 232, column 41; to line 232, column 125

              <label class="form-label form-label-left form-label-auto" id="label_6" for="input_6"> Prefe

  • Sammy
    Replied on October 21, 2015 at 3:40 PM

    I checked the URL and it appears you have used the source code method to embed your form on the site.

    The CSS warning appear when the CSS ins not included within the <HEAD> tag of the page if you do not want to add it within the head add the following property to your CSS links

    property='stylesheet'

    i.e

     

    <link rel='stylesheet' property='stylesheet' href='http://www.someurl.com/modules/14ce1e21/peadig-eucookie.css' type='text/css' media='all' />

    Ideally you can embed using the iframe method in order to minimize the Wc3 warning.

    http://www.jotform.com/help/148-Gettiog-the-Form-iFrame-Code

  • faithemc
    Replied on October 22, 2015 at 8:00 AM

    Thanks for the solution for the missing 'Property' attribute. I used Googles mobile friendly service and it passes.

    What about the errors:

    Error: Element style not allowed as child of element div in this context. 

    From line 170, column 25; to line 170, column 47

              <style type="text/css">↩  

    Error: The for attribute of the label element must refer to a non-hidden form control

  • Carina
    Replied on October 22, 2015 at 10:32 AM

    "Error: The for attribute of the label element must refer to a non-hidden form control"

    2 of these errors are connected with the fact that both Full name and Phone fields have 2 fields but only one label. If you replace the Full name and phone fields for text-box fields this error will disappear.

    You can clone  the demo form:

    https://form.jotform.com/52944667102962? 

    I will see the solution for the other error.

    I will contact you as soon as I have more details.

    Let us know if we can assist you further.   

  • faithemc
    Replied on October 22, 2015 at 5:11 PM

    I've changed the name to a single field and regenerated - no W3C error and passes Google's mobile friendly test.

    Thank you.

  • Boris
    Replied on October 22, 2015 at 9:06 PM

    On behalf of my colleagues, Sammy and Carina, you are most welcome.

    If you need assistance with anything else, please do not hesitate to open a new support thread about it, and we'll do our best to help.