6

Possible Duplicate:
Using the XHTML closing slash (/) on normal tags?
Are self-closing tags valid in HTML5?

I'm reviewing a lot of HTML code and also JavaScript that synthesizes HTML and I noted that if there's some tag without content inside the tag then there're two way to specify it. Either like this:

<div id="container"></div>

or like this:

<div id="container" />

Is there any difference between the two?

Community
  • 1
  • 1
sharptooth
  • 167,383
  • 100
  • 513
  • 979
  • 1
    With that high of a reputation, I suspect this is a legitimate question and shouldn't be closed. I've always wanted to know why self closing tags don't always work the way you'd expect (like not being able to use a self closing script tag when including js) – John Weldon May 23 '12 at 19:00
  • 2
    The other questions ask about whether it's possible, this question asks what the difference is. This is not a dupe. – zzzzBov May 23 '12 at 19:01
  • @zzzzBov — While the question is slightly different, it is sufficiently close that the accepted answer on [Are self-closing tags valid in HTML5?](http://stackoverflow.com/questions/3558119/are-self-closing-tags-valid-in-html5) answers this question as well. – Quentin May 23 '12 at 19:05

3 Answers3

6

Browsers normalize invalid markup into the valid form:

<div /> is technically invalid markup (HTML 5), as div is not a self-closing tag.

A browser will normalize it to <div>.

Note that this is different from how XML will handle a self-closing tag compared to a closed tag.

A self-closing tag has no children and no value for inner text (null):

<foo />

A closed tag has no children and no inner text (empty string):

<foo></foo>
zzzzBov
  • 174,988
  • 54
  • 320
  • 367
  • `
    ` is perfectly valid HTML 2/3/4. It just isn't well supported by browsers. It will be (under the error correction rules in the HTML 5 parsing algorithm (which represent what browsers have done for years)) normalised to `
    ` not `
    `
     – Quentin May 23 '12 at 19:07
  • @Quentin, my mistake on the normalization bit. I should have specified HTML5 as that's all I care about these days. – zzzzBov May 23 '12 at 19:13
-1

<div id="container"/> is the proper XHTML way of writing tags that contain no content. Typically these are <img/>, <br/>, and the like. <div> is intended to have content inside it so saying <div id="container"/>, while acceptable, seems less readable.

jason
  • 1,247
  • 1
  • 9
  • 25
  • 1
    It is *a* way of writing an element with no content. It isn't better or worse then `
    ` … unless you are dealing with the HTML compatibility rules (in which case `
    ` is just unacceptable). The question was asking about HTML though, not XHTML.     – Quentin May 23 '12 at 19:03
-2

The first example is strict HTML while the second is strict xHTML.

Pre HTML5, when you had to specify if you were using HTML or xHTML, using the wrong syntax would cause validation errors and sometimes rendering problems. Using the HTML5 doctype makes the difference moot.

Secondly, the second example is one of a self-closing tag, in this case an empty div, but many tags in the xHTML spec support that, including img, link, meta, and any other tag that would be otherwise empty.

Rob Lowe
  • 827
  • 6
  • 10