I’m sorry Timmy but you’re not allowed to have any dessert unless you close your tags like I taught you. Your grandmother was XMLish and you need to carry on our family tradition.
I thought you might do something like this so I got you a backup one from AO3.
🤓 ackshually that’s not the HTML spec. Void elements should not have trailing slashes.
https://developer.mozilla.org/en-US/docs/Glossary/Void_element
> Clicks on <br>
> Example is <br />
The actual thing that matters is that the /
is ignored so (unlike with XML I believe) you can’t self-close a non-void element by adding a trailing /
. But “void elements should not have trailing slashes” is extrapolation on your part; the trailing slash improves readability and is kosher since it doesn’t act as a self-close.
It’s not extrapolation on my part, the HTML spec is pretty direct about it:
- Then, if the element is one of the void elements, or if the element is a foreign element, then there may be a single U+002F SOLIDUS character (/), which on foreign elements marks the start tag as self-closing. On void elements, it does not mark the start tag as self-closing but instead is unnecessary and has no effect of any kind. For such void elements, it should be used only with caution — especially since, if directly preceded by an unquoted attribute value, it becomes part of the attribute value rather than being discarded by the parser.
https://html.spec.whatwg.org/multipage/syntax.html#start-tags
I don’t think it’s an extrapolation to say that code which is “unnecessary and has no effect of any kind” should be omitted.
And yeah, I linked the MDN docs because they’re easier to read but if they disagree then obviously the spec is the correct one.
An explanation of this problem can be found on the official W3C HTML validator wiki.
HTML parsers only allow this to stop pages breaking when developers make mistakes; see this Computerphile video. ‘Able to be parsed correctly’ is not the soul criterion for it a syntax being preferred, otherwise we would all leave our <p>
elements unclosed.
Yes, it is not “incorrect” to write <br/>
, but it is widely considered bad practice. For one, it makes it inconsistent with XML. Linters will often even “correct” this for you.
I personally find the official style (<br>
) to be more readable, but this is a matter of personal opinion. Oh, and I used to have the same stance as you, but I also used to think that Python’s whitespace-based syntax was superior…
At the end of the day, regardless of anyone’s opinion, we should come to SOME consensus…and considering that W3C already endorses <br>
, we should use this style.
Trailing slash lets you do this though:
For example, in the case of
<div/>Some text
, browsers interpret this as<div>Some text</div>
, treating the slash as ignored and considering the div element to encapsulate the text that follows.
TIL. Funny thing, though, is that they give an example of how to use <br>
and have it with trailing slashes. And then explain that trailing or preceding slash will be ignored, anyway ¯\_(ツ)_/¯
If it’s stupid, and it works…
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
<br>
elements go <br>
Need some padding between elements?
Haha nbsp; go brrrrrrrr
The one on the right should be labeled “full-stack dev” because that’s like 80% of them and they write in C# and Angular 😂