The Old NetISSUE #7 of 60

all tags must close · self-closing too

Pixel PeteVSQuirks Mode

Pixel Pete saysEvery element must close — including void elements, written as self-closing .

XML has no implicitly-closed tags. Container elements need a closing tag (…); void elements that have no content must self-close with a trailing slash:  , <img … />, <input … />, <hr />, <meta … />. (In HTML5 the slash is optional.)

Power-ups you unlock

Containers need a closing tag
Void elements self-close:
Applies to img, input, hr, meta, link
HTML5 makes the slash optional

Quirks Mode attacks — common mistakes

Unclosed or <img> in XHTML
Forgetting the space before /> in some parsers
Self-closing a container that has content

Boss battleSelf-close every void element in a snippet and close every container.

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre>invalid: &lt;br&gt; &lt;img src="x"&gt;
valid:   &lt;br /&gt; &lt;img src="x" /&gt;</pre></body></html>

▶ Open the interactive comic issue

‹ All Tags Lowercase · The Case Rule Proper Nesting · No Overlap Allowed ›