Hacker News Reader

This is way off topic, but I want to share since I just learned about this a day or two ago. Skip over this comment if you don't care about HTML5 trivia.

I had no idea what this was supposed to be, and I thought maybe it just wasn't loading more content, so I checked the source. While there, Firefox told me there was an error with the HTML, and that the <section> element contained elements that hadn't been properly closed.

This turned out to be because of the first <div> element in the section, because it's trying to be a self-closing element when such a thing isn't possible.

As it turns out, the slashes you see in such elements as <br /> are purely decoration in HTML5. They're a holdover for people like me, who like the structure that XHTML tried to bring to the language. <br> is the proper HTML5 element, and <br /> is just there for decoration/compatibility. The slash doesn't mark the element as void - the element is void regardless of whether or not you use the slash.

The impact of this is that trying to create a self-closing <div> in HTML5 by including the slash in the start tag - i.e. <div /> - only opens a <div> without closing it. You need to include a closing tag right after the opening tag to get the result you want - i.e. <div></div>.

The HTML5 spec [1] covers this nicely: "[I]f 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 (/). This character has no effect on void elements, but on foreign elements it marks the start tag as self-closing." Furthermore, the space before the slash is only necessary for XHTML [2].

[1]: http://dev.w3.org/html5/spec/single-page.html#start-tags [2]: http://www.w3.org/TR/xhtml1/#C_2

That's not what foreign elements are. If you click the link to "foreign elements" in your first link, you'll see that the spec[1] defines foreign elements as "Elements from the MathML namespace and the SVG namespace." In other words, elements which are foreign to HTML.

The <div> element is a "normal element", and the spec doesn't seem to indicate what to do with the slash/solidus on normal elements, only on void or foreign ones.

I got my information for my previous comment from an answer on StackOverflow[2], but the w3c's validator seems to back it up. The OP has been changed to use the explicit close tag on that element, so you'll have to edit the source to use the (non-)self-closing version to check it yourself, but it kicked up errors for me.

Specifically, the error given read "Self-closing syntax (/>) used on a non-void HTML element. Ignoring the slash and treating as a start tag." This is what I said in my previous comment, albeit much more succinctly.

As for your second comment, regarding the space before the slash, I don't understand its relevance to my comment. I said nothing about the space in the element; I only referred to the effect of the slash. Also, you're talking about XHTML, and linking to its spec, in a discussion regarding HTML5. If I'm missing your point, please clarify.

[1] http://dev.w3.org/html5/spec/single-page.html#elements-0

[2] http://stackoverflow.com/a/3558200/1588

[3] http://validator.w3.org/#validate_by_input

I linked to the HTML spec because it explains that the slash only means something for void or foreign elements. The <div> element is neither, so the slash is either interpreted as an attribute or ignored. You are correct, both in this comment and the previous one; I was agreeing with you and providing sources.

My comment about the spaces was trivia on top of your trivia. I thought it was relevant because all of your examples of self-closing tags had a space.

Ah, well in that case I certainly apologize. I inferred a tone from your comment which you didn't intend to be there.

I'll take one for the team: I don't get it, what does this mean?

I dunno, but this looks pretty: http://waves.arelikefacebook.com/

Trees, too > http://trees.arelikefacebook.com/

Seems accurate: http://rabid.bunnies.arelikefacebook.com/

It makes more sense if you've seen this:

http://www.youtube.com/watch?feature=player_embedded&v=c...

which brought on at least one parody I've seen:

http://www.youtube.com/watch?v=-2vfxnfWGRA

Or this: http://www.youtube.com/watch?v=5i32fJ7-4-4

I spilled my breakfast.... the video's funny because it's so true.

Type some text over 'chairs' and it will give you an image plus some more text. I think this is supposed to be a parody of a commercial FB ran a little while back, where they compared chairs to facebook.

I actually kind of wonder how they did it, the images are (mostly) accurate. Maybe a google image search?

Most common English words in the subdomain seem to work.

Even apparently non-plurals:

http://shit.arelikefacebook.com/

Some other good ones:

http://weirdos.arelikefacebook.com/ http://bangs.arelikefacebook.com/ (cute) http://freedom.arelikefacebook.com/

Multiple words work as well:

http://hanging.chads.arelikefacebook.com/

http://scrotums.arelikefacebook.com/

In a similar vein: http://weiners.arelikefacebook.com, probably one of the best films of all time.

http://nazis.arelikefacebook.com

Boom!