ansaurus

Question

Why do multiple spaces in an HTML file show up as single spaces in the browser?

Answer 1

A:

It's in the HTML spec. It's the part about inter-word spaces being rendered as an ASCII space.

http://www.w3.org/TR/html401/struct/text.html

Chris Farmer 2009-01-11 19:40:39

Answer 2

A:

Simple, it's in the specification.

From the HTML specification, section 9.1:

In particular, user agents should collapse input white space sequences when producing output inter-word space.

casperOne 2009-01-11 19:41:01

That doesn't explain "why".

PEZ 2009-01-11 19:44:54

Answer 3

A:

Whitespace is ignore beyond one space when rendering, even new lines. To put more spaces use   in place of the space character. To put a new line, use  . Like for your example, do this:

Hello.     Hello. Hello. Hello.                Hello.

I can't get the formatting to show up in a code block for some reason. That is the best I could do.

Dan Herbert 2009-01-11 19:41:36

Answer 4

A:

The definition/specifications of HTML clearly stated to ignore excess whitespace.

If you want to include extra spaces, use either the <pre> tag or  

TheTXI 2009-01-11 19:43:49

Answer 5

+12 A:

Spaces are compacted in HTML because there's a distinction between how HTML is formatted and how it should be rendered. Consider a page like this:

<html>
    <body>
     <a href="mylink">A link</a>
    </body>
</html>

If the HTML was indented using spaces for example, the link would be preceded by several spaces.

tristan 2009-01-11 19:45:09

Just to point out the obvious in the example, the link will in fact be rendered " A link " (without quotes of course).

roe 2009-01-11 19:59:57

@roe only if there was something before it. The browser won't render a leading whitespace.

TM 2009-02-28 16:46:35

@TM If I remember correctly, roe was commenting on a previous version of the answer I had posted. I should probably have added an [edit:] section.

tristan 2009-02-28 16:58:01

Answer 6

A:

As others have said, it's in the HTML specification.

If you want to preserve whitespace in output, you can use the <pre> tag:

<pre>This     text has              extra spaces

and

    newlines</pre>

But this will also generally display the text in a different font.

Zach Hirsch 2009-01-11 19:45:17

which could be fixed with css.

enobrev 2009-01-11 19:47:14

Answer 7

+5 A:

Not only is it in the specification, but there is some sense to it. If spaces weren't compacted, you would have to put all your html on a single line. so something like this:

<div>
    <h1>Title</h1>
    <p>
       This is some text
       <a href="#">Read More</a>
    </p>
</div>

Would have some strange alignment with spaces all over the place. The only way to get it right would be to compact that code, which would be difficult to maintain.

enobrev 2009-01-11 19:45:24

Answer 8

+6 A:

"Why are multiple spaces converted to single spaces?"

First, "why" questions are hard to answer. It's in the spec. That's pretty much the end of it.

Consider that there are several kinds of white space.

White space between tags. \nhi\n
White space in the content within a tag. Hi everyone.
White space in a <pre> or CDATA section.

The first two are hard to distinguish. Whitespace between tags, even in XML, is "optional". But when you have what is called a "mixed content model" -- tags intermixed with content -- the subtlety of "between tags" and "in the content but between tags" and "in the content but not between tags" is impossible to sort out.

So they don't sort it out. Whitespace between tags and whitespace in the content is all optional.

S.Lott 2009-01-11 19:45:48

Answer 9

+1 A:

If browsers did not do this, it could be difficult to format your HTML code to make it easily readable. For example, you might want to format your code like this:

<html>
<body>
    <div>
        I like to indent all content that is inside div tags.
    </div>
</body>
</html>

If the browser does not ignore the eight or so spaces before the text inside the div tag, your webpage might not look the way you intended it to look.

Michael Angstadt 2009-01-11 20:01:44

Despite the SGML comments elsewhere, this may be closest to the truth of WHY. From the HTML 2.0 spec, the HTML example in the section "HTML as an Application of SGML" says in the only mention of white space: "Whitespace may be used to assist in reading the HTML source."

Alohci 2009-01-11 21:05:14

Answer 10

+5 A:

To try to address the "why" it may be because HTML was based on SGML which had specified it that way. It was in turn based on GML from the early 60's. The reason for white space handling could very well be because data was entered one "card" at a time back then which could result in undesired breakup of sentences and paragraphs. One difference in the old GML is that it specified that there has to be two spaces between sentences (like the old typewriter rules) which may have established a precedenct that spaces are independent of the markup.

Turnkey 2009-01-11 20:15:12

+1 to that, goes deeper than my SGML answer!

Paul Dixon 2009-01-11 20:21:53

Answer 11

+1 A:

To answer why is this in the specification for HTML? you have to consider the origins of HTML.

Tim Berners-Lee designed HTML for sharing of scientific documents. He based it on pre-existing syntax ideas in SGML, which also has similar treatments of whitespace.

One can imagine that earlier writers of HTML at CERN did so without the aid of WYSIWYG tools, and so the ability to treat whitespace in this way aids legibility of such hand-written source files.

Paul Dixon 2009-01-11 20:21:03

Answer 12

+1 A:

There's also a typographic answer: words and sentences should have only one space between them, regardless of what your typing teacher in school may have told you.

Use One Space Between Sentences

Use A Single Word Space Between Sentences

Barry Brown 2009-01-11 20:21:25

I don't think this answer is relevant, because according to it, should not be allowed.

Blaisorblade 2009-01-11 22:33:14

It wasn't part of the original HTML spec, but was added later as a design crutch because other methods of "moving text around" hadn't yet been created. A "non-breaking space" has a clear typographic meaning. It shouldn't be used to add extra spaces or to indent text.

Barry Brown 2009-01-12 20:06:00

ansaurus

tags:

views:

answers:

Why do multiple spaces in an HTML file show up as single spaces in the browser?

related questions