When is a / required in a self-closing element?

I was stumped for quite a while on an early step in the Registration Form project in the new Responsive Web Design. My code would not pass the tests when adding the self-closing link element.

It turned out that

<link rel="stylesheet" type="text/css" href="styles.css">

wasn’t accepted, but if I closed the element with />, it was:

<link rel="stylesheet" type="text/css" href="styles.css"/>

From what I could find on MDN, it’s not particularly common to require the / for self-closing elements.

Further to my confusion, OTHER self-closing tags in the project don’t seem to require it.

The code snippet below DID pass the tests, despite not having the closing tag at all.

<body>
    <h1>Registration Form</h1>
    <p>Please fill out this form with the required information</p>
    <form action="https://register-demo.freecodecamp.org">

  </body>

When I move to the next step, the closing tag has been added.

Further along in the project, the tags pass the tests without the /, but they are automatically added when you move to the next step. So it seems in this one case it’s required, while in other cases it’s optional (but hints at best practice?).

Am I missing something regarding optional closing tags? Or is it just the nature of the freeCodeCamp text editor and testing that sometimes misses things?

I came here to ask why I couldn’t get past this part, i didn’t know about ending with />

Thank you

1 Like

HI @captainCarrot !

Welcome to the forum!

The is an open issue concerning this lesson

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.