Join Bill Weinman for an in-depth discussion in this video Understanding how empty space is formatted in XHTML, part of XHTML and HTML Essential Training.
- View Offline
As we begin to talk about how XHTML deals with text, let's start with white space. White space is any kind of space, the space character, the tab character. It's a line feed. Any kind of white space, XHTML has a special way of dealing with it. So here we have a document and it has our front matter at the top. It has head section and a body section and it has a couple of paragraphs and these are paragraph tags. See the p at the beginning and the end tag at the end.
Everything inside of the paragraph element is a paragraph. So this text here is in a paragraph by itself and you see in the browser down here, we have our text editor at the top and our browser at the bottom so we can see what we are doing. The browser down there, that's in a paragraph by itself and this other line of text is in a paragraph by itself down here in the browser as well. So notice that the paragraph has words and it has spaces. Now if I go ahead and change this and just add a bunch of spaces and save the document and then go down here and reload in the browser, you will notice that the line of text does not change. All of these extra spaces are all folded into one space in the document in the browser.
So this is what XHTML does with space, and HTML works exactly the same way. All of these spaces are folded into one space in the browser. Now if instead of inserting a bunch of spaces, what if I insert a bunch of new lines and then save it? So I save the document and I reload in the browser and you will notice that the line of text is exactly the same. All of these new line characters are also folded into one space in the browser.
So this is how XHTML deals with white space. In fact, it doesn't matter what kind of white space it is or what kind of combination of white space it is. I could have a number of spaces up here. I could have a number of new lines down here. I could have more spaces over here and I could even break up another part of the line and all of this-- and I save the document and I load it up in the browser and it's still just the one line of text.
So this is how HTML and XHTML deal with white space. All white space is in a row. It's adjacent to each other. It is between pieces of text. All white spaces folded into one space character in the browser when it renders the line of text.
- Understanding the structure of an HTML or XHTML document
- Creating and using templates
- Controlling white space and line breaks
- Making effective use of tables and frames
- Flowing text around an image
- Formatting tables with CSS
- Creating web pages that work properly across platforms and devices
- Reviewing a case study of a complete web site