24

This is one of those things that you read once, say "aha!" and then forget. Exactly my case.

Why is the line-break tag in xhtml preferentially written with a space <br /> and not in the also ok format <br/> ? I remember the reason was interesting, and as you can imagine it's not easy to find with google.

For sure it's not an issue of xml well-formedness. From W3C

[44]    EmptyElemTag       ::=      '<' Name (S Attribute)* S? '/>' 

   Empty-element tags may be used for any element which has no content, whether
   or not it is declared using the keyword EMPTY. For interoperability, the 
   empty-element tag should be used, and should only be used, for elements which 
   are declared EMPTY.

Examples of empty elements:

<IMG align="left"  src="http://www.w3.org/Icons/WWW/w3c_home" /> 
<br></br> 
<br/>

So the space at the end is optional.

Stefano Borini
  • 138,652
  • 96
  • 297
  • 431

13 Answers13

46

w3c specifies this as the grammar:

EmptyElemTag       ::=      '<' Name (S Attribute)* S? '/>'

That means open bracket, a name, a number of (space and attribute) tokens, an optional space, a slash, and an end tag. According to this, both are correct.

Matt
  • 10,434
  • 1
  • 36
  • 45
25

If I recall correctly it's simply because some older browsers had problems with a self-closing tag without a space before the slash. I doubt it's an issue nowadays, but a lot of developers (myself included) got into the habit of including the space.

Edit: Ah, here we are:

http://www.w3.org/TR/xhtml1/#guidelines

Include a space before the trailing / and > of empty elements, e.g. <br />, <hr /> and <img src="karen.jpg" alt="Karen" />. Also, use the minimized tag syntax for empty elements, e.g. <br />, as the alternative syntax <br></br> allowed by XML gives uncertain results in many existing user agents.

Matt Hamilton
  • 200,371
  • 61
  • 386
  • 320
  • IIRC, the only "older browser" that had the issue was IE6, still in wide use when you posted your answer. But today, almost into 2021, VS Code is still automatically formatting my void tags to have the space. – John Churchill Dec 15 '20 at 02:57
23

Some older browsers didn't parse the element correctly without the space, so most web developers use <br />. I don't remember which browsers offhand, but I believe they're just about extinct.

EDIT: The browser was Netscape 4.

Community
  • 1
  • 1
SLaks
  • 868,454
  • 176
  • 1,908
  • 1,964
15

There is no right way in XHTML. They are formally identical in XML. Whitespace is not significant in that location.

bmargulies
  • 97,814
  • 39
  • 186
  • 310
  • 2
    There's no difference in XHTML, but there is in plain HTML - the `/` actually ends the tag, so your `
    ` would display as break + `>`. The convention ` />` was adopted as a compromise     – K Prime Jan 19 '10 at 02:09
  • You know, I temporarily lost track of the 'html' aspect, in spite of my comment. Of course in old enough HTML the /> form won't work. – bmargulies Jan 19 '10 at 02:52
  • @K Prime - the space doesn't help with that problem. It is only browsers getting that bit of HTML wrong that allows HTML-compatible XHTML to work. – Quentin Jan 19 '10 at 06:36
9

For XHTML: both of them. For HTML4 and earlier: neither.

Jörg W Mittag
  • 363,080
  • 75
  • 446
  • 653
7

<br /> is valid (old) HTML, while <br/> is not. If you are serving your XHTML as XML, it doesn't matter. If you are serving it as text/html, then it needs to be valid HTML in addition to being valid XHTML. (Why serve XHTML as HTML? Because IE doesn't understand XHTML as XML, and because no major browser will start rendering XHTML mid-way through downloading the text, but they will do that to HTML. My blog appears to load slowly not because the site is slow, but because the browser won't start rendering the page until everything has been fetched. I hate browsers.)

jrockway
  • 42,082
  • 9
  • 61
  • 86
  • 2
    This is the real reason. HTML doesn't have the self-closing tag syntax — whether a tag needs to be explicitly closed is a function of the kind of tag it is (e.g., `
    ` doesn't while `
    ` does). When you write `
    `, an HTML parser sees a `
    ` tag with an empty attribute called "/" (just like the empty "checked" attribute for inputs). Since the `
    ` tag is already self-closing in HTML, this works the same in both HTML and XML modes.
     – Chuck Nov 02 '09 at 20:58
  • @Chuck. I've seen that explanation before, but I can't say I believe it. If it were so then renderings of the DOM with say Firebug, or Hixie's Live DOM Viewer should show the attribute as /="", but they don't. See here: http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C!DOCTYPE%20html%3E%0D%0Atext%3Cbr%20checked%20%2F%3E (Apologies for putting a "checked" attribute on a br element - I know it's not valid but it demonstrates my point.) – Alohci Nov 02 '09 at 21:13
  • 1
    @Alohci: That's an implementation detail of Firefox. Going purely by the HTML standard, there is no `
    ` tag.     – Chuck Nov 02 '09 at 21:25
  • 2
    Plain false: the only valid br element in HTML 4.01 is `
    `. `
    ` or `
    ` are both invalid tag soup, but the former has less problems in real browsers.     – ntd Nov 12 '09 at 23:55
  • 2
    "
    is valid (old) HTML." No, it isn't, but browsers cope with it. The advice I've seen it to use spaces if you use the text/html MIME type. You don't need them if you use application/xhtml+xml.     – TRiG Jan 21 '10 at 12:20
7

A little background to add to Matt Hamilton's answer.

A least one problem browser was Netscape 4. A quick check shows that in that browser, <br/> (i.e. no space) doesn't cause a line break. In fact, it doesn't appear to do anything. <br /> (i.e. with space) does perform a line break.

When creating polyglot documents that can behave as XHTML or HTML (Note: "behave as" - not "valid") it's necessary to use either <br /> or <br></br>. However, when parsed as HTML, </br> is treated as if it was <br>, so <br></br> produces two line breaks.

Alohci
  • 78,296
  • 16
  • 112
  • 156
  • 3
    I would say... **facepalm** for the `` producing a line break :) – Stefano Borini Nov 03 '09 at 06:37
  • It's because one person did it like that once, whined that it didn't work, and then the browsers started supporting it. That's why Firefox uses 600M of RAM... lots of "special cases". – jrockway Nov 03 '09 at 06:58
5

Both <br/> and <br /> are correct. The reason that <br /> came about in the first place was to support older browsers that didn't understand the new <br/> syntax. It's really kind of a hack where the / is interpreted as an attribute with no value and ignored.

Asaph
  • 159,146
  • 25
  • 197
  • 199
4

Both are correct, and both will be accepted by web browsers. You may as well save yourself the extra character, and use <br/>

LBushkin
  • 129,300
  • 32
  • 216
  • 265
3

Both are correct. But I would use <br /> just to keep my code consistent... because I would never write

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>

instead of

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

just to save a byte... and the second version is imho better readable. But that's just a matter of taste. Do it as you like, but do it consistent :-)

Leo
  • 37,640
  • 8
  • 75
  • 100
1

Either will work just fine. Assuming you are asking for evangelical reasons, I prefer <br/>

slf
  • 22,595
  • 11
  • 77
  • 101
0

Both are correct.

Amra
  • 24,780
  • 27
  • 82
  • 92
0

<br>. You aren't using XML anyway.

Ms2ger
  • 15,596
  • 6
  • 36
  • 35